From b89020692f02135132c18b91e5c44be6ab03a767 Mon Sep 17 00:00:00 2001 From: Jhony Date: Sun, 5 Oct 2025 18:01:15 -0300 Subject: [PATCH] =?UTF-8?q?integra=C3=A7=C3=A3o=20de=20acessibilidade=20v1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/cadastro/page.tsx | 46 ++++++------- app/context/AccessibilityContext.tsx | 99 ++++++++++++++++++++++++++++ app/doctor/login/page.tsx | 32 ++++----- app/doctor/medicos/page.tsx | 44 ++++++------- app/finance/login/page.tsx | 34 +++++----- app/globals.css | 31 +++++++++ app/layout.tsx | 17 +++-- app/manager/login/page.tsx | 32 ++++----- app/page.tsx | 67 ++++++++++--------- app/patient/login/page.tsx | 42 ++++++------ app/secretary/login/page.tsx | 32 ++++----- app/secretary/pacientes/page.tsx | 20 +++--- components/accessibility-modal.tsx | 95 ++++++++++++++++++++++++++ components/doctor-layout.tsx | 58 ++++++++-------- components/finance-layout.tsx | 28 ++++---- components/hospital-layout.tsx | 26 ++++---- components/manager-layout.tsx | 28 ++++---- components/patient-layout.tsx | 28 ++++---- components/secretary-layout.tsx | 28 ++++---- components/theme-initializer.tsx | 32 +++++++++ 20 files changed, 540 insertions(+), 279 deletions(-) create mode 100644 app/context/AccessibilityContext.tsx create mode 100644 components/accessibility-modal.tsx create mode 100644 components/theme-initializer.tsx diff --git a/app/cadastro/page.tsx b/app/cadastro/page.tsx index 7b6fb88..843a490 100644 --- a/app/cadastro/page.tsx +++ b/app/cadastro/page.tsx @@ -5,15 +5,15 @@ import { Calendar, Clock, User, Shield, Stethoscope, Receipt, IdCard } from "lu export default function HomePage() { return ( -
+
-

Central de Operações
+

Central de Operações

MedConnect

-

+

Gerencie suas consultas médicas de forma simples e eficiente

@@ -21,21 +21,21 @@ export default function HomePage() {
- + Área do Paciente Tenha o controle total da sua saúde: agende, consulte o histórico e informações pessoais
-
+
Agendar consultas
-
+
Ver histórico de consultas
-
+
Gerenciar dados pessoais
@@ -54,21 +54,21 @@ export default function HomePage() {
-
+
Gerenciar consultas
-
+
Cadastrar pacientes
-
+
Controlar agenda
- + @@ -81,21 +81,21 @@ export default function HomePage() {
-
+
Gerenciar agenda
-
+
Ver pacientes
-
+
Histórico de atendimentos
- + @@ -108,21 +108,21 @@ export default function HomePage() {
-
+
Relatórios gerenciais
-
+
Configurações do sistema
-
+
Gestão de usuários
- + @@ -135,21 +135,21 @@ export default function HomePage() {
-
+
Relatórios financeiros
-
+
Faturamento
-
+
Controle de pagamentos
- + diff --git a/app/context/AccessibilityContext.tsx b/app/context/AccessibilityContext.tsx new file mode 100644 index 0000000..f63e18e --- /dev/null +++ b/app/context/AccessibilityContext.tsx @@ -0,0 +1,99 @@ +"use client"; + +import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react'; + +type Theme = 'light' | 'dark'; +type Contrast = 'normal' | 'high'; + +interface AccessibilityContextProps { + theme: Theme; + setTheme: (theme: Theme) => void; + contrast: Contrast; + setContrast: (contrast: Contrast) => void; + fontSize: number; + increaseFontSize: () => void; + decreaseFontSize: () => void; + resetFontSize: () => void; +} + +const AccessibilityContext = createContext(undefined); + +export const AccessibilityProvider = ({ children }: { children: ReactNode }) => { + const [theme, setThemeState] = useState(() => { + if (typeof window === 'undefined') return 'light'; + return (localStorage.getItem('accessibility-theme') as Theme) || 'light'; + }); + const [contrast, setContrastState] = useState(() => { + if (typeof window === 'undefined') return 'normal'; + return (localStorage.getItem('accessibility-contrast') as Contrast) || 'normal'; + }); + const [fontSize, setFontSize] = useState(() => { + if (typeof window === 'undefined') return 16; + const storedSize = localStorage.getItem('accessibility-font-size'); + return storedSize ? parseFloat(storedSize) : 16; + }); + + useEffect(() => { + const root = document.documentElement; + + // Theme + root.classList.remove('light', 'dark'); + root.classList.add(theme); + localStorage.setItem('accessibility-theme', theme); + + // Contrast + root.classList.remove('normal-contrast', 'high-contrast'); + root.classList.add(contrast === 'high' ? 'high-contrast' : 'normal-contrast'); + localStorage.setItem('accessibility-contrast', contrast); + + // Font Size + root.style.fontSize = `${fontSize}px`; + localStorage.setItem('accessibility-font-size', fontSize.toString()); + + }, [theme, contrast, fontSize]); + + const setTheme = (newTheme: Theme) => { + setThemeState(newTheme); + }; + + const setContrast = (newContrast: Contrast) => { + setContrastState(newContrast); + }; + + const increaseFontSize = () => { + setFontSize(prev => Math.min(prev + 2, 24)); // Cap at 24px + }; + + const decreaseFontSize = () => { + setFontSize(prev => Math.max(prev - 2, 12)); // Cap at 12px + }; + + const resetFontSize = () => { + setFontSize(16); + }; + + return ( + + {children} + + ); +}; + +export const useAccessibility = () => { + const context = useContext(AccessibilityContext); + if (context === undefined) { + throw new Error('useAccessibility must be used within an AccessibilityProvider'); + } + return context; +}; diff --git a/app/doctor/login/page.tsx b/app/doctor/login/page.tsx index 2e40bd2..95195fb 100644 --- a/app/doctor/login/page.tsx +++ b/app/doctor/login/page.tsx @@ -65,57 +65,57 @@ export default function DoctorLogin() { } return ( -
- +
+ -
- +
+
- Área do Médico - Acesse o sistema médico + Área do Médico + Acesse o sistema médico
-
-