Skip to content

Text Size and High-Contrast Accessibility Settings #19

Description

@ankit2101

Summary

Add a settings toggle on the student interface for: larger text (1.25x, 1.5x scale), high-contrast mode, and the ability to turn off auto-play TTS.

Why

Inclusive design is increasingly mandated in Indian educational software. Students with mild visual impairment or reading difficulties (dyslexia prevalence ~10–15%) benefit substantially. Effort is low; coverage is high.

Implementation Notes

  • Preferences stored in localStorage
  • Text size: CSS custom property --text-scale applied to root
  • High contrast: add .high-contrast class to body, override CSS variables
  • TTS auto-play: add autoPlayTTS preference, check before calling speak() in QuestionCard
  • Settings accessible via a gear icon on the student test header

Acceptance Criteria

  • Text size toggle: Normal / Large / Extra Large
  • High-contrast mode toggle
  • TTS auto-play on/off toggle
  • All preferences persist across sessions via localStorage
  • Settings accessible from student home and test screens

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3 - LowLow priority - futureaccessibilityAccessibility and language featuresbacklogBacklog itemenhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions