txeo/cv-site
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add new background patterns for light and dark themes

Browse Source 
Light theme:
- Change background from #b8bbbe to #d6d6d6 (light gray)
- Add concentric squares pattern with 4 gradient layers
- Creates subtle geometric texture on gray background

Dark theme:
- Change background from rgb(82, 86, 89) to #3a3a3a (medium gray)
- Add diagonal grid pattern with green glow (rgba(0, 255, 128, 0.15))
- 45deg and -45deg crosshatch creates retro tech aesthetic

Both patterns use CSS custom properties (--page-bg-pattern) and are
applied via background-image in _reset.css. Patterns are fixed and
maintain visibility across theme switches.
This commit is contained in:
juanatsap
2025-11-20 13:50:53 +00:00
parent d2ee1074fc
commit 0671955280
2 changed files with 27 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/css/01-foundation/_variables.css
+7 -1
View File
@@ -15,7 +15,13 @@
/* Theme System - These get overridden by color-theme.css */
/* Page Background */
--page-bg: #b8bbbe;
--page-bg: #d6d6d6;
/* Page Background Pattern - Concentric Squares */
--page-bg-pattern: repeating-linear-gradient(0deg, transparent, transparent 5px, rgba(75, 85, 99, 0.06) 5px, rgba(75, 85, 99, 0.06) 6px, transparent 6px, transparent 15px),
repeating-linear-gradient(90deg, transparent, transparent 5px, rgba(75, 85, 99, 0.06) 5px, rgba(75, 85, 99, 0.06) 6px, transparent 6px, transparent 15px),
repeating-linear-gradient(0deg, transparent, transparent 10px, rgba(107, 114, 128, 0.04) 10px, rgba(107, 114, 128, 0.04) 11px, transparent 11px, transparent 30px),
repeating-linear-gradient(90deg, transparent, transparent 10px, rgba(107, 114, 128, 0.04) 10px, rgba(107, 114, 128, 0.04) 11px, transparent 11px, transparent 30px);
/* Paper/Card Backgrounds */
--paper-bg: #ffffff;