cv-site

txeo/cv-site

Fork 0

Commit Graph

Author	SHA1	Message	Date
juanatsap	c834919a3c	fix: Default to light theme for all first-time visitors First-time visitors now always see light theme (paper aesthetic) regardless of their system dark mode preference. Users can still switch to dark or auto mode, and their preference is saved to localStorage for future visits. This maintains the professional CV paper appearance as the default experience while giving users full control over their preference.	2025-11-30 09:35:31 +00:00
juanatsap	2f466e46bc	feat: Default to light theme on mobile devices on first visit Implements device-aware theme defaults: - Mobile devices (≤768px): Default to light theme - Desktop devices (>768px): Default to auto theme - Saved preferences: Always respected regardless of device Implementation: 1. FOUC Prevention Script (templates/index.html): - Detects device type using window.innerWidth/clientWidth/screen.width - Sets initial theme before page render to prevent flash - Mobile: 'light', Desktop: 'auto' 2. Theme Initialization (static/js/color-theme.js): - Modified initColorTheme() to respect FOUC-detected theme - Saves FOUC-detected theme to localStorage for persistence - Prevents overwriting mobile detection with 'auto' default Test Coverage: - Test 1: Mobile first visit → light theme ✅ - Test 2: Desktop first visit → auto theme ✅ - Test 3: Saved preference honored → dark theme ✅ Files Modified: - templates/index.html: Added mobile detection in FOUC prevention - static/js/color-theme.js: Respect FOUC-detected theme - tests/mjs/49-mobile-light-theme-default.mjs: Comprehensive test suite Screenshots: - tests/screenshots/mobile-light-theme-default.png - tests/screenshots/desktop-auto-theme-default.png	2025-11-23 08:37:29 +00:00
juanatsap	f3cce51fb3	feat: implement color theme switcher with dynamic button colors Complete color theme system (light/dark/auto) with dynamic UI: Features: - Color theme switcher with auto/light/dark modes - Dynamic button colors on hover (purple/yellow/blue per theme) - localStorage persistence across sessions - Proper button positioning (desktop and mobile) - Mobile: 5-button layout with theme before info button Fixes: - CSP updated to allow jsDelivr CDN for iconify icons - Button repositioning: Download PDF and Print Friendly at top - Hover-only colors (not persistent) - Mobile button order corrected Files: - static/css/color-theme.css - Theme system with CSS variables - static/js/color-theme.js - Theme switching logic - templates/partials/color-theme-switcher.html - Button component - internal/middleware/security.go - CSP fix for jsDelivr - tests/mjs/13-color-theme-switcher.test.mjs - Comprehensive test - tests/TEST-SUMMARY.md - Updated test documentation	2025-11-18 15:49:30 +00:00

Author

SHA1

Message

Date

juanatsap

c834919a3c

fix: Default to light theme for all first-time visitors

First-time visitors now always see light theme (paper aesthetic)
regardless of their system dark mode preference.

Users can still switch to dark or auto mode, and their preference
is saved to localStorage for future visits.

This maintains the professional CV paper appearance as the default
experience while giving users full control over their preference.

2025-11-30 09:35:31 +00:00

juanatsap

2f466e46bc

feat: Default to light theme on mobile devices on first visit

Implements device-aware theme defaults:
- Mobile devices (≤768px): Default to light theme
- Desktop devices (>768px): Default to auto theme
- Saved preferences: Always respected regardless of device

Implementation:
1. FOUC Prevention Script (templates/index.html):
   - Detects device type using window.innerWidth/clientWidth/screen.width
   - Sets initial theme before page render to prevent flash
   - Mobile: 'light', Desktop: 'auto'

2. Theme Initialization (static/js/color-theme.js):
   - Modified initColorTheme() to respect FOUC-detected theme
   - Saves FOUC-detected theme to localStorage for persistence
   - Prevents overwriting mobile detection with 'auto' default

Test Coverage:
- Test 1: Mobile first visit → light theme ✅
- Test 2: Desktop first visit → auto theme ✅
- Test 3: Saved preference honored → dark theme ✅

Files Modified:
- templates/index.html: Added mobile detection in FOUC prevention
- static/js/color-theme.js: Respect FOUC-detected theme
- tests/mjs/49-mobile-light-theme-default.mjs: Comprehensive test suite

Screenshots:
- tests/screenshots/mobile-light-theme-default.png
- tests/screenshots/desktop-auto-theme-default.png

2025-11-23 08:37:29 +00:00

juanatsap

f3cce51fb3

feat: implement color theme switcher with dynamic button colors

Complete color theme system (light/dark/auto) with dynamic UI:

Features:
- Color theme switcher with auto/light/dark modes
- Dynamic button colors on hover (purple/yellow/blue per theme)
- localStorage persistence across sessions
- Proper button positioning (desktop and mobile)
- Mobile: 5-button layout with theme before info button

Fixes:
- CSP updated to allow jsDelivr CDN for iconify icons
- Button repositioning: Download PDF and Print Friendly at top
- Hover-only colors (not persistent)
- Mobile button order corrected

Files:
- static/css/color-theme.css - Theme system with CSS variables
- static/js/color-theme.js - Theme switching logic
- templates/partials/color-theme-switcher.html - Button component
- internal/middleware/security.go - CSP fix for jsDelivr
- tests/mjs/13-color-theme-switcher.test.mjs - Comprehensive test
- tests/TEST-SUMMARY.md - Updated test documentation

2025-11-18 15:49:30 +00:00

3 Commits