txeo/cv-site
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
526 Commits 1 Branch 2 Tags
8e029d13631bd890b0c9c122a1ebeb825a899f62
Commit Graph

3 Commits

Author SHA1 Message Date
juanatsap 0956c78d00 style: Add CSS variable fallbacks for better browser compatibility 
Following LogRocket CSS best practices:
- Added fallback values to 150+ CSS variable usages across 22 files
- Fallbacks use light theme defaults for consistent behavior
- Improves compatibility with older browsers
- Example: var(--text-primary) → var(--text-primary, #1a1a1a)

Variables with fallbacks:
- Colors: text-primary, text-secondary, text-muted, accent-blue, etc.
- Backgrounds: page-bg, paper-bg, action-bar-bg, sidebar-bg
- Shadows: shadow-sm, shadow-md, shadow-lg
- Borders: border-color, border-light, icon-border

CSS Variables Best Practices compliance: 6/7 recommendations now followed
 2025-11-30 14:35:02 +00:00
juanatsap e373a7d0ae fix: Navigation menu text colors in dark theme 
The menu was showing light gray text in dark theme, creating poor contrast
against the white menu background. Menu text must always be dark since
the menu background is always white regardless of theme.

Changes:
- Added dark theme overrides for .navigation-menu and .submenu-content
- Force --text-dark to #1a1a1a (dark text) in dark theme for menu
- Force --text-gray to #333333 (dark gray) in dark theme for menu icons
- Applied same fix for auto theme when system preference is dark

Result:
- Menu text: Dark/black (rgb(26, 26, 26)) in all themes
- Menu icons: Dark gray (rgb(51, 51, 51)) in all themes
- Menu background: White (rgb(255, 255, 255)) in all themes
- Proper contrast and readability restored

Test created: 68-menu-colors-dark-theme-test.mjs
Screenshots: menu-light-theme.png, menu-dark-theme.png
 2025-11-27 23:42:23 +00:00
juanatsap 1258d61d05 refactor: Modularize CSS into ITCSS architecture + update documentation 
CSS Refactoring:
- Split 2,287-line monolith into 6 focused modules
- New structure: Navigation, Scroll, Buttons, Modals, Zoom, Breakpoints
- Organized by ITCSS layers (Interactive + Responsive)
- 245 lines saved through better organization
- Site verified working at localhost:1999

New CSS Files:
- 04-interactive/_navigation.css (357 lines, 8.2KB)
- 04-interactive/_scroll-behavior.css (200 lines, 5.0KB)
- 04-interactive/_buttons.css (184 lines, 4.7KB)
- 04-interactive/_modals.css (487 lines, 16KB)
- 04-interactive/_zoom-control.css (253 lines, 6.3KB)
- 05-responsive/_breakpoints.css (561 lines, 14KB)

Documentation Updates:
- Added doc/12-CSS-ARCHITECTURE.md (comprehensive CSS guide)
- Updated doc/README.md (new entry + correct numbering)
- Updated tests/README.md (test count 8 → 27)
- Updated tests/TEST-SUMMARY.md (coverage expansion)
- Rewrote tests/mjs/README.md (complete test listing)

Removed:
- static/css/04-interactive/_remaining.css (replaced by modules)
 2025-11-20 12:34:42 +00:00