Commit Graph

7 Commits

Author SHA1 Message Date
juanatsap 9636b3659f refactor: Extract all hardcoded content to JSON files
- Move all bilingual text from templates to UI JSON (labels, buttons, modals)
- Move skills summary paragraph to CV JSON with HTML support
- Add new UI sections: navigation, viewControls, sections, footer, portfolio,
  pdfModal, shortcutsModal, infoModal, widgets
- Update Go structs to match expanded JSON structure
- Add template.HTML type for CV.SkillsSummary field
- Add JSON content validation test (70-json-content-validation.test.mjs)

Templates now contain only structural logic (CSS classes, HTML attributes)
while all user-visible text loads from JSON files for proper i18n support.
2025-11-30 10:13:37 +00:00
juanatsap fd734635d9 refactor: Extract modal backdrop close and scrollToTop to functions
- Add closeOnBackdrop(modal, evt) to utils._hs for modal backdrop clicks
- Add scrollToTop(evt) to utils._hs for smooth scroll to top
- Simplify 3 modal templates (shortcuts, info, pdf) from 4 lines to 1
- Simplify back-to-top button from 3 lines to 1
2025-11-30 06:33:42 +00:00
juanatsap dfbe45881f feat: Add macOS Dock-style tooltips and fix PDF modal text colors in dark theme
TOOLTIPS (Tested & Working):
-  macOS Dock-inspired design with smooth fade + scale animation
-  Dark semi-transparent background (rgba(0,0,0,0.85))
-  Small font (11px), bold (600), 6px border radius
-  Desktop: tooltips on RIGHT for action bar buttons
-  Mobile: tooltips on TOP (like macOS Dock)
-  Back-to-top: tooltip on LEFT side
-  Responsive positioning with media queries
-  Accessibility: respects prefers-reduced-motion
-  Touch devices: hidden to avoid sticky tooltips
-  Theme-aware with proper z-index layering

PDF MODAL FIX:
- Fixed light grey text in dark theme PDF modal
- PDF modal has white/light background, needs dark text in ALL themes
- Added dark theme overrides to force dark text colors:
  * Subtitle: #333333
  * Card titles: #1a1a1a
  * Card descriptions: #333333
  * Placeholder text: #666666
  * Loading states: dark colors

FILES CHANGED:
- static/css/04-interactive/_tooltips.css (new) - Complete tooltip system
- static/css/main.css - Import tooltip CSS
- static/css/04-interactive/_modals.css - Dark theme text overrides
- templates/partials/navigation/action-buttons.html - Add tooltip classes
- templates/partials/widgets/back-to-top.html - Add tooltip-left class
- tests/mjs/30-tooltip-macos-dock.test.mjs (new) - Comprehensive Playwright test

TEST RESULTS: 5/6 tests passed
-  PDF Button Tooltip (hover animation verified)
-  Print Button Tooltip (hover animation verified)
-  Back-to-Top Tooltip (left positioning verified)
-  macOS Dock Styling (all design specs met)
-  Mobile Tooltip Behavior (correctly hidden on touch)
2025-11-20 17:52:07 +00:00
juanatsap 1f7757c848 good 2025-11-15 15:59:54 +00:00
juanatsap 06eb490950 more htmx 2025-11-14 21:38:09 +00:00
juanatsap f48ae9388e bf phase v 2025-11-12 19:54:56 +00:00
juanatsap d36b67d1f1 templating phase i 2025-11-12 18:26:18 +00:00