santhoshj/clawfort
1
0
Fork 0
Code Issues 64 Pull Requests Actions Packages Projects Releases Wiki Activity
Files
local-playwright
clawfort/openspec/changes/p19-vj-defects/tasks.md
Santhosh Janardhanan f6beedd68f p19-bug-fixes
2026-02-13 16:57:45 -05:00

2.3 KiB
Raw Permalink Blame History

1. Font Implementation

  • 1.1 Update Google Fonts link to include Baloo 2 and Baloo Chettan fonts
  • 1.2 Update font-family CSS declarations with new Indic font stack
  • 1.3 Add font-display: swap to prevent layout shift during font loading
  • 1.4 Define font fallback chain: Baloo → Noto Sans → system-ui → sans-serif

2. Mobile Hero Block Typography

  • 2.1 Add CSS media query for mobile viewports (≤640px) with data-lang="ta" or data-lang="ml"
  • 2.2 Reduce hero title font size from 1.9rem to 1.6rem for Tamil/Malayalam
  • 2.3 Reduce hero summary font size from 1.08rem to 0.95rem for Tamil/Malayalam
  • 2.4 Ensure minimum line-height of 1.5 for readability
  • 2.5 Verify touch targets remain at least 44px in height

3. Mobile Hero Block Layout

  • 3.1 Reduce hero image height from 300px to 220px on mobile
  • 3.2 Ensure image maintains aspect ratio and doesn't overflow container
  • 3.3 Verify entire hero content (headline + summary) is visible without clipping
  • 3.4 Test hero block on actual mobile devices (iOS Safari, Android Chrome)

4. Footer Tooltip Fix

  • 4.1 Debug Alpine.js tooltip state management for contact email link
  • 4.2 Ensure tooltip displays on mouse hover event
  • 4.3 Ensure tooltip displays on keyboard focus event
  • 4.4 Ensure tooltip dismisses cleanly on mouse leave
  • 4.5 Ensure tooltip dismisses cleanly on keyboard blur without trapping focus
  • 4.6 Verify tooltip content displays randomized safe messages from predefined pool
  • 4.7 Test tooltip accessibility with screen readers

5. Testing and Validation

  • 5.1 Test Tamil content rendering with new fonts on mobile
  • 5.2 Test Malayalam content rendering with new fonts on mobile
  • 5.3 Verify WCAG AA contrast ratios are maintained after font size changes
  • 5.4 Test font loading performance (LCP, CLS metrics)
  • 5.5 Verify all Tamil/Malayalam Unicode characters render correctly
  • 5.6 Test footer tooltip across browsers (Chrome, Firefox, Safari, Edge)
  • 5.7 Test responsive behavior from 320px to 1920px viewports

6. Documentation

  • 6.1 Update font documentation in README or style guide
  • 6.2 Document mobile typography scale for Indic languages
  • 6.3 Add comments in CSS explaining mobile font size adjustments
Reference in New Issue View Git Blame Copy Permalink