diff --git a/public/index.html b/public/index.html index c964584..98777e3 100644 --- a/public/index.html +++ b/public/index.html @@ -23,5 +23,6 @@ + diff --git a/src/App.css b/src/App.css index 9544f59..6d94f35 100644 --- a/src/App.css +++ b/src/App.css @@ -35,4 +35,13 @@ to { transform: rotate(360deg); } +} + +html[data-bs-theme="dark"] .App-header { + background-color: #121212; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .App-link { + color: #bb86fc; } \ No newline at end of file diff --git a/src/PagesAdm/gestao.css b/src/PagesAdm/gestao.css index 6d1b591..5991041 100644 --- a/src/PagesAdm/gestao.css +++ b/src/PagesAdm/gestao.css @@ -253,3 +253,114 @@ color: #1e3a8a; transform: scale(1.2); } + +html[data-bs-theme="dark"] .dashboard-container { + background-color: #121212; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .dashboard-header, +html[data-bs-theme="dark"] .dashboard-title, +html[data-bs-theme="dark"] .dashboard-subtitle { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .new-user-btn { + background-color: #2563eb; + color: #fff; +} + +html[data-bs-theme="dark"] .new-user-btn:hover { + background-color: #1e40af; +} + +html[data-bs-theme="dark"] .filters-container, +html[data-bs-theme="dark"] .user-table-container { + background: #1a1a1a; + box-shadow: 0 4px 6px rgba(0,0,0,0.4); +} + +html[data-bs-theme="dark"] .filters-title, +html[data-bs-theme="dark"] .user-table-container h2 { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .filters-subtitle, +html[data-bs-theme="dark"] .user-table-container p { + color: #bdbdbd; +} + +html[data-bs-theme="dark"] .filters-input, +html[data-bs-theme="dark"] .filters-select { + background: #232323; + color: #e0e0e0; + border-color: #333; +} + +html[data-bs-theme="dark"] .filters-input:focus, +html[data-bs-theme="dark"] .filters-select:focus { + border-color: #2563eb; + box-shadow: 0px 0px 0px 3px rgba(37, 99, 235, 0.2); +} + +html[data-bs-theme="dark"] .cards-container .card { + background-color: #181818; + color: #e0e0e0; + box-shadow: 0 4px 6px rgba(0,0,0,0.4); +} + +html[data-bs-theme="dark"] .highlight:hover { + background: #232a3a; + border: 1px solid #2563eb33; +} + +html[data-bs-theme="dark"] .card-label { + color: #888; +} + +html[data-bs-theme="dark"] .card-value { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .card-extra { + color: #bdbdbd; +} + +html[data-bs-theme="dark"] .card-extra.positive { + color: #2563eb; +} + +html[data-bs-theme="dark"] .user-table th { + background-color: #232323; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .user-table td { + color: #e0e0e0; + border-bottom: 1px solid #333; +} + +html[data-bs-theme="dark"] .user-table tr:hover { + background-color: #232a3a; +} + +html[data-bs-theme="dark"] .profile-badge { + background-color: #2563eb; + color: #fff; +} + +html[data-bs-theme="dark"] .status-badge.ativo { + background-color: #28a745; +} + +html[data-bs-theme="dark"] .status-badge.inativo { + background-color: #dc3545; +} + +html[data-bs-theme="dark"] .action-icon { + color: #bdbdbd; +} + +html[data-bs-theme="dark"] .action-icon:hover { + color: #2563eb; +} \ No newline at end of file diff --git a/src/PagesAdm/painel.css b/src/PagesAdm/painel.css index d476105..6a54058 100644 --- a/src/PagesAdm/painel.css +++ b/src/PagesAdm/painel.css @@ -208,7 +208,60 @@ .department-info { font-size: 13px; - color: #333; + color: #333; white-space: nowrap; } +html[data-bs-theme="dark"] .painel-container { + background-color: #121212; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .painel-titulo, +html[data-bs-theme="dark"] .painel-subtitulo, +html[data-bs-theme="dark"] .card-info, +html[data-bs-theme="dark"] .grafico-titulo, +html[data-bs-theme="dark"] .grafico-subtitulo, +html[data-bs-theme="dark"] .performance-titulo, +html[data-bs-theme="dark"] .performance-subtitulo, +html[data-bs-theme="dark"] .department-name, +html[data-bs-theme="dark"] .department-info { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .painel-card, +html[data-bs-theme="dark"] .grafico-card, +html[data-bs-theme="dark"] .performance-container { + background: #1a1a1a; + box-shadow: 0px 2px 8px rgba(0,0,0,0.5); + border-color: #222; + color: #fff; +} + +html[data-bs-theme="dark"] .painel-card:hover { + background: #232a36; + border: 1px solid #0066ff33; + box-shadow: 0px 8px 24px rgba(0,102,255,0.12); + color: #fff; +} + +html[data-bs-theme="dark"] .badge { + background: #0050cc; + color: #fff; +} + +html[data-bs-theme="dark"] .progress-bar, +html[data-bs-theme="dark"] .departamento-barra { + background: #222; + color: #fff; +} + +html[data-bs-theme="dark"] .progress-fill { + background: #3388ff; + color: #fff; +} + +html[data-bs-theme="dark"] .departamento-fill { + background: #3388ff; + color: #fff; +} \ No newline at end of file diff --git a/src/PagesAdm/painel.jsx b/src/PagesAdm/painel.jsx index f37716b..1861054 100644 --- a/src/PagesAdm/painel.jsx +++ b/src/PagesAdm/painel.jsx @@ -150,7 +150,7 @@ export default function PainelAdministrativo() { {dep.nome} diff --git a/src/PagesMedico/styleMedico/Agendamento.css b/src/PagesMedico/styleMedico/Agendamento.css index 6b887ab..fe00c0c 100644 --- a/src/PagesMedico/styleMedico/Agendamento.css +++ b/src/PagesMedico/styleMedico/Agendamento.css @@ -1,151 +1,157 @@ -/* --- Esconde a barra de unidade e profissional --- */ -.unidade-selecionarprofissional { - display: none; +/* Default (light mode) styles */ +html { + background-color: #f8f9fa; + color: #212529; } -/* --- Posiciona a barra de busca corretamente --- */ -.busca-atendimento { - display: flex; - align-items: center; /* Alinha os itens verticalmente */ - margin-top: 20px; /* Espaço acima da barra de busca */ - padding: 0 10px; /* Adiciona um padding lateral para alinhar com o resto */ - gap: 15px; -} - -.busca-atendimento > div:first-child { - width: 400px; /* Define um tamanho para a barra de pesquisa */ - display: flex; - align-items: center; +.calendario { + background-color: #fff; + border: 1px solid #dee2e6; + box-shadow: 0 4px 12px rgba(0,0,0,0.08); } .busca-atendimento input { - margin-left: 8px; - border-radius: 8px; - padding: 8px; - width: 100%; - border: 1px solid #ccc; + background-color: #fff; + color: #212529; + border: 1px solid #ced4da; } .busca-atendimento select { - padding: 8px; - border-radius: 8px; - background-color: #0078d7; - color: white; - font-weight: bold; - border: none; + background-color: #5980fd; + color: #fff; } -/* --- Estilos dos botões de Dia, Semana, Mês --- */ .btn-selecionar-tabeladia, .btn-selecionar-tabelasemana, .btn-selecionar-tabelames { - background-color: rgba(231, 231, 231, 0.808); - padding: 8px 10px; - font-size: larger; - font-weight: bold; - border-style: hidden; - cursor: pointer; -} - -.btn-selecionar-tabeladia { - border-radius: 10px 0px 0px 10px; -} - -.btn-selecionar-tabelames { - border-radius: 0px 10px 10px 0px; + background-color: #fff; + color: #212529; } .btn-selecionar-tabeladia.ativo, .btn-selecionar-tabelasemana.ativo, .btn-selecionar-tabelames.ativo { - background-color: lightcyan; - border-color: darkcyan; - font-weight: bolder; -} - -/* --- Container dos botões e legenda --- */ -.btns-e-legenda-container { - display: flex; - justify-content: space-between; - align-items: center; - margin-top: 10px; - padding: 0 10px; -} - -/* --- Legendas --- */ -.legenda-tabela { - display: flex; - gap: 15px; -} - -#status-card-consulta-realizado, .legenda-item-realizado { - background-color: #b7ffbd; - border: 3px solid #91d392; - padding: 5px; - font-weight: bold; - border-radius: 10px; -} - -#status-card-consulta-cancelado, .legenda-item-cancelado { - background-color: #ffb7cc; - border: 3px solid #ff6c84; - padding: 5px; - font-weight: bold; - border-radius: 10px; -} - -#status-card-consulta-confirmado, .legenda-item-confirmado { - background-color: #eef8fb; - border: 3px solid #d8dfe7; - padding: 5px; - font-weight: bold; - border-radius: 10px; -} - -#status-card-consulta-agendado, .legenda-item-agendado { - background-color: #f7f7c4; - border: 3px solid #f3ce67; - padding: 5px; - font-weight: bold; - border-radius: 10px; -} - -/* --- Estrutura Geral --- */ -.calendario { - border-collapse: collapse; - width: 100%; - border-radius: 10px; - overflow: hidden; - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); - border: 1px solid #eee; - background-color: #ffffff; -} - -.calendario-ou-filaespera { - margin-top: 0; -} - -.container-btns-agenda-fila_esepera { - margin-top: 30px; - display: flex; - flex-direction: row; - gap: 20px; - margin-left: 20px; + background-color: #5980fd; + color: #fff; + border-color: #3a5ccc; } .btn-fila-espera, .btn-agenda { - background-color: transparent; - border: 0px; + background-color: #fff; + color: #212529; border-bottom: 3px solid transparent; - padding: 8px; - border-radius: 10px 10px 0px 0px; - font-weight: bold; - cursor: pointer; } .opc-filaespera-ativo, .opc-agenda-ativo { - color: white; background-color: #5980fd; -} \ No newline at end of file + color: #fff; +} + +#status-card-consulta-realizado, +.legenda-item-realizado { + background-color: #e6f9e6; + border: 3px solid #b7ffbd; + color: #2e4d2e; +} + +#status-card-consulta-cancelado, +.legenda-item-cancelado { + background-color: #ffe6ee; + border: 3px solid #ffb7cc; + color: #4d2e36; +} + +#status-card-consulta-confirmado, +.legenda-item-confirmado { + background-color: #e6f0fa; + border: 3px solid #eef8fb; + color: #2e3a4d; +} + +#status-card-consulta-agendado, +.legenda-item-agendado { + background-color: #f7f7c4; + border: 3px solid #f7f7c4; + color: #4d4d2e; +} + +/* Dark mode styles */ +html[data-bs-theme="dark"] { + background-color: #181a1b; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .calendario { + background-color: #23272a; + border: 1px solid #333; + box-shadow: 0 4px 12px rgba(0,0,0,0.25); +} + +html[data-bs-theme="dark"] .busca-atendimento input { + background-color: #23272a; + color: #e0e0e0; + border: 1px solid #444; +} + +html[data-bs-theme="dark"] .busca-atendimento select { + background-color: #5980fd; + color: #fff; +} + +html[data-bs-theme="dark"] .btn-selecionar-tabeladia, +html[data-bs-theme="dark"] .btn-selecionar-tabelasemana, +html[data-bs-theme="dark"] .btn-selecionar-tabelames { + background-color: #23272a; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .btn-selecionar-tabeladia.ativo, +html[data-bs-theme="dark"] .btn-selecionar-tabelasemana.ativo, +html[data-bs-theme="dark"] .btn-selecionar-tabelames.ativo { + background-color: #5980fd; + color: #fff; + border-color: #3a5ccc; +} + +html[data-bs-theme="dark"] .btn-fila-espera, +html[data-bs-theme="dark"] .btn-agenda { + background-color: #23272a; + color: #e0e0e0; + border-bottom: 3px solid transparent; +} + +html[data-bs-theme="dark"] .opc-filaespera-ativo, +html[data-bs-theme="dark"] .opc-agenda-ativo { + background-color: #5980fd; + color: #fff; +} + +html[data-bs-theme="dark"] #status-card-consulta-realizado, +html[data-bs-theme="dark"] .legenda-item-realizado { + background-color: #1e2e1e; + border: 3px solid #2e4d2e; + color: #b7ffbd; +} + +html[data-bs-theme="dark"] #status-card-consulta-cancelado, +html[data-bs-theme="dark"] .legenda-item-cancelado { + background-color: #2e1e23; + border: 3px solid #4d2e36; + color: #ffb7cc; +} + +html[data-bs-theme="dark"] #status-card-consulta-confirmado, +html[data-bs-theme="dark"] .legenda-item-confirmado { + background-color: #1e2327; + border: 3px solid #2e3a4d; + color: #eef8fb; +} + +html[data-bs-theme="dark"] #status-card-consulta-agendado, +html[data-bs-theme="dark"] .legenda-item-agendado { + background-color: #2e2e1e; + border: 3px solid #4d4d2e; + color: #f7f7c4; +} diff --git a/src/PagesMedico/styleMedico/FilaEspera.css b/src/PagesMedico/styleMedico/FilaEspera.css index e27086b..b3994ba 100644 --- a/src/PagesMedico/styleMedico/FilaEspera.css +++ b/src/PagesMedico/styleMedico/FilaEspera.css @@ -95,3 +95,54 @@ font-size: 1.5rem; text-align: center; } + +html[data-bs-theme="dark"] .fila-container { + background: #232326 !important; + box-shadow: 0 4px 12px rgba(0,0,0,0.5); + border: 10px solid #232326 !important; +} + +html[data-bs-theme="dark"] .fila-titulo { + color: #e0e0e0; + border-bottom: 2px solid #444; +} + +html[data-bs-theme="dark"] .fila-tabela { + color: #e0e0e0; + background: #232326; +} + +html[data-bs-theme="dark"] .fila-tabela th, +html[data-bs-theme="dark"] .fila-tabela td { + border-bottom: 1px solid #444; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .fila-tabela th { + background-color: #2c2c31; +} + +html[data-bs-theme="dark"] .fila-tabela thead { + background-color: #232326; +} + +html[data-bs-theme="dark"] .fila-tabela tbody tr:nth-child(even) { + background-color: #28282c; +} +html[data-bs-theme="dark"] .fila-tabela tbody tr:nth-child(odd) { + background-color: #232326; +} + +html[data-bs-theme="dark"] .fila-tabela tbody tr:hover { + background-color: #31313a; +} + +html[data-bs-theme="dark"] .busca-fila-espera { + background: #232326; + color: #e0e0e0; + border: 1px solid #444; +} + +html[data-bs-theme="dark"] .busca-fila-espera:focus { + border-color: #888; +} \ No newline at end of file diff --git a/src/PagesMedico/styleMedico/chat.css b/src/PagesMedico/styleMedico/chat.css index 3f6042c..9010f80 100644 --- a/src/PagesMedico/styleMedico/chat.css +++ b/src/PagesMedico/styleMedico/chat.css @@ -296,3 +296,79 @@ max-width: 100%; } } + +html[data-bs-theme="dark"] .chat-app-container { + background-color: #121212 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .sidebar, +html[data-bs-theme="dark"] .chat-header, +html[data-bs-theme="dark"] .message-footer { + background-color: #1a1a1a !important; + border-color: #222 !important; +} + +html[data-bs-theme="dark"] .sidebar-header { + background-color: #1a1a1a !important; + border-bottom: 1px solid #222 !important; +} + +html[data-bs-theme="dark"] .search-input, +html[data-bs-theme="dark"] .message-input { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; +} + +html[data-bs-theme="dark"] .search-input:focus, +html[data-bs-theme="dark"] .message-input:focus { + box-shadow: 0 0 0 2px #3B82F6 !important; +} + +html[data-bs-theme="dark"] .conversation-item { + background-color: transparent !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .conversation-item:hover { + background-color: #232323 !important; +} + +html[data-bs-theme="dark"] .conversation-item.active { + background-color: #3B82F6 !important; + color: #fff !important; +} + +html[data-bs-theme="dark"] .timestamp, +html[data-bs-theme="dark"] .last-message { + color: #bdbdbd !important; +} + +html[data-bs-theme="dark"] .conversation-item.active .timestamp, +html[data-bs-theme="dark"] .conversation-item.active .last-message { + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .unread-badge { + background-color: #EF4444 !important; + color: #fff !important; +} + +html[data-bs-theme="dark"] .messages-body { + background-color: #181818 !important; +} + +html[data-bs-theme="dark"] .message-container.sent .message-bubble { + background-color: #2563EB !important; + color: #fff !important; +} + +html[data-bs-theme="dark"] .message-container.received .message-bubble { + background-color: #232323 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .no-conversation-selected { + color: #bdbdbd !important; +} \ No newline at end of file diff --git a/src/PagesMedico/styleMedico/geral.css b/src/PagesMedico/styleMedico/geral.css index 94918bd..2e86a44 100644 --- a/src/PagesMedico/styleMedico/geral.css +++ b/src/PagesMedico/styleMedico/geral.css @@ -186,4 +186,86 @@ tbody tr:hover { td { padding: 12px; border-bottom: 1px solid var(--cor-borda); +} + +html[data-bs-theme="dark"] { + --cor-primaria: #3a86ff; /* Azul principal */ + --cor-fundo: #121212; /* Fundo escuro */ + --cor-card: #1e1e1e; /* Card escuro */ + --cor-texto: #e0e0e0; /* Texto claro */ + --cor-borda: #333333; /* Bordas escuras */ + --sombra-card: 0 4px 12px rgba(0, 0, 0, 0.5); /* Sombra mais forte */ +} + +html[data-bs-theme="dark"] body { + background-color: var(--cor-fundo); + color: var(--cor-texto); +} + +html[data-bs-theme="dark"] h1 { + color: var(--cor-primaria); + border-bottom: 2px solid var(--cor-borda); +} + +html[data-bs-theme="dark"] h2 { + color: var(--cor-texto); + border-bottom: 1px solid var(--cor-borda); +} + +html[data-bs-theme="dark"] .prontuario-container, +html[data-bs-theme="dark"] .relatorios-container { + background-color: var(--cor-card); + border: 1px solid var(--cor-borda); + box-shadow: var(--sombra-card); +} + +html[data-bs-theme="dark"] .prontuario-section { + background-color: #232323; + border: 1px solid var(--cor-borda); +} + +html[data-bs-theme="dark"] .prontuario-section li { + border-bottom: 1px solid var(--cor-borda); +} + +html[data-bs-theme="dark"] .prontuario-section strong { + color: #b0b0b0; +} + +html[data-bs-theme="dark"] .filtros-container, +html[data-bs-theme="dark"] .info-text { + background-color: #232323; + border: 1px solid var(--cor-borda); + color: var(--cor-texto); +} + +html[data-bs-theme="dark"] .btn-gerar { + background-color: var(--cor-primaria); + color: #fff; +} + +html[data-bs-theme="dark"] .btn-gerar:hover { + background-color: #2656b8; +} + +html[data-bs-theme="dark"] table { + background-color: var(--cor-card); +} + +html[data-bs-theme="dark"] thead th { + background-color: var(--cor-primaria); + color: #fff; +} + +html[data-bs-theme="dark"] tbody tr:nth-child(even) { + background-color: #232323; +} + +html[data-bs-theme="dark"] tbody tr:hover { + background-color: #333; +} + +html[data-bs-theme="dark"] td { + border-bottom: 1px solid var(--cor-borda); + color: var(--cor-texto); } \ No newline at end of file diff --git a/src/assets/scss/_utilities.scss b/src/assets/scss/_utilities.scss index 8af2dc2..db12161 100644 --- a/src/assets/scss/_utilities.scss +++ b/src/assets/scss/_utilities.scss @@ -64,4 +64,36 @@ .icon-mid:before { vertical-align: middle; } // Z Index -.z-1 { z-index: 1 } \ No newline at end of file +.z-1 { z-index: 1 } + +// Utilities for Dark Mode +html[data-bs-theme="dark"] { + .bg-light { + background-color: #232323 !important; + color: #e0e0e0 !important; + } + .text-black { + color: #e0e0e0 !important; + } + .card { + background-color: #232323; + border-color: #333; + color: #e0e0e0; + } + .table { + color: #e0e0e0; + thead { + th { + border-bottom: 2px solid #333; + } + } + tbody { + tr { + border-bottom: 1px solid #333; + } + tr:hover { + background-color: #2c2c2c; + } + } + } +} \ No newline at end of file diff --git a/src/assets/scss/app.scss b/src/assets/scss/app.scss index 45f7c8c..5c70ec4 100644 --- a/src/assets/scss/app.scss +++ b/src/assets/scss/app.scss @@ -19,3 +19,9 @@ body .bi::before, [class^=bi-]::before, [class*=" bi-"]::before { // Mazer CSS @import "./mazer"; + +@import './_variables.scss'; // Light variables + +@import './themes/dark/_variables-dark.scss'; // Dark variables +@import './themes/dark/_mazer-dark.scss'; // Dark theme overrides + diff --git a/src/assets/scss/components/_alert.scss b/src/assets/scss/components/_alert.scss index 4b7f38e..3837dbe 100644 --- a/src/assets/scss/components/_alert.scss +++ b/src/assets/scss/components/_alert.scss @@ -1,8 +1,7 @@ - .alert { border:none; - .alert-heading { - } + // .alert-heading { + // } p { margin-bottom: 0; } @@ -51,3 +50,10 @@ } } } +html[data-bs-theme="dark"] { + .alert { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } +} diff --git a/src/assets/scss/components/_avatar.scss b/src/assets/scss/components/_avatar.scss index 16dd904..e386e98 100644 --- a/src/assets/scss/components/_avatar.scss +++ b/src/assets/scss/components/_avatar.scss @@ -89,4 +89,28 @@ font-size: 1.8rem; } } +} + +html[data-bs-theme="dark"] { + .avatar { + background-color: #232323; + color: #e0e0e0; + + .avatar-content { + color: #e0e0e0; + background-color: #232323; + svg, i { + color: #e0e0e0; + } + } + + img { + background-color: #232323; + } + + .avatar-status { + border-color: #232323; + background-color: #444; + } + } } \ No newline at end of file diff --git a/src/assets/scss/components/_badge.scss b/src/assets/scss/components/_badge.scss index 43ac910..4498e27 100644 --- a/src/assets/scss/components/_badge.scss +++ b/src/assets/scss/components/_badge.scss @@ -15,6 +15,13 @@ padding: 3px; } -a.badge:hover { +// a.badge:hover { +// } + +html[data-bs-theme="dark"] { + .badge { + background-color: #333 !important; + color: #e0e0e0 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_breadcrumb.scss b/src/assets/scss/components/_breadcrumb.scss index 0cfcbb4..06dbdb6 100644 --- a/src/assets/scss/components/_breadcrumb.scss +++ b/src/assets/scss/components/_breadcrumb.scss @@ -7,4 +7,12 @@ justify-content: center; margin-top: $breadcrumb-margin-top; } +} + +html[data-bs-theme="dark"] { + .breadcrumb { + background-color: #232323 !important; + color: #e0e0e0 !important; + // Add more styles as needed for dark mode + } } \ No newline at end of file diff --git a/src/assets/scss/components/_buttons.scss b/src/assets/scss/components/_buttons.scss index 89f3814..24f442b 100644 --- a/src/assets/scss/components/_buttons.scss +++ b/src/assets/scss/components/_buttons.scss @@ -60,3 +60,21 @@ margin: 0 10px 10px 0; } } + +html[data-bs-theme="dark"] { + .btn { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .btn-primary { + background-color: #1976d2 !important; + color: #fff !important; + border-color: #1565c0 !important; + } + .btn-light { + background-color: #333 !important; + color: #e0e0e0 !important; + border-color: #444 !important; + } +} diff --git a/src/assets/scss/components/_card.scss b/src/assets/scss/components/_card.scss index 2372c49..75ca11a 100644 --- a/src/assets/scss/components/_card.scss +++ b/src/assets/scss/components/_card.scss @@ -130,3 +130,86 @@ } } } + +html[data-bs-theme="dark"] { + .card { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + + &.card-statistic { + box-shadow: 1px 2px 5px rgba(#2FAAF4, .3); + background: linear-gradient(to bottom, #1a1a1a, #232323); + .card-title { + color: rgba(255, 255, 255, 0.8); + } + .card-right { + p { + color: #fff; + } + span.green { + color: #6fff6f; + } + span.red { + color: #ff7979; + } + } + } + + .card-header { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .card-body { + background-color: #232323 !important; + color: #e0e0e0 !important; + } + .card-content { + background-color: #232323 !important; + } + .card-heading { + color: #e0e0e0 !important; + } + .card-img-overlay { + background-color: rgba(0,0,0,.7); + p { + color: #ccc; + } + .card-title { + color: #fff; + } + } + } + + .pricing { + .card { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + box-shadow: 0 10px 10px #222; + } + .card-header { + background-color: #232323 !important; + color: #e0e0e0 !important; + } + .card-highlighted { + background-color: #1a1a1a !important; + .card-header, .card-body, .card-footer { + background-color: #1a1a1a !important; + color: #fff !important; + } + ul { + li { + i, svg { + color: $teal-400; + } + color: #fff; + } + } + .card-title { + color: #fff !important; + } + } + } +} diff --git a/src/assets/scss/components/_carousel.scss b/src/assets/scss/components/_carousel.scss index b1b24a9..b0c3950 100644 --- a/src/assets/scss/components/_carousel.scss +++ b/src/assets/scss/components/_carousel.scss @@ -3,4 +3,15 @@ } .carousel-caption h5 { color: $carousel-caption-color +} + +html[data-bs-theme="dark"] { + .carousel-inner { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .carousel-caption h5 { + color: #e0e0e0 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_comment.scss b/src/assets/scss/components/_comment.scss index fe917f7..4d7cce9 100644 --- a/src/assets/scss/components/_comment.scss +++ b/src/assets/scss/components/_comment.scss @@ -50,8 +50,26 @@ // Dark theme html[data-bs-theme="dark"] .comment { border: 1px solid #404053 !important; + background-color: #232336 !important; + color: #e0e0f0 !important; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); + + &-header { + .avatar-content { + background-color: #404053; + } + } + + &-body { + // Optional: adjust text color if needed + color: #e0e0f0; + } &-time { - color:#6a9cd2 !important; + color: #6a9cd2 !important; } + + // &-actions { + // // Optional: adjust button/link color if needed + // } } \ No newline at end of file diff --git a/src/assets/scss/components/_divider.scss b/src/assets/scss/components/_divider.scss index 1945b8e..81e957e 100644 --- a/src/assets/scss/components/_divider.scss +++ b/src/assets/scss/components/_divider.scss @@ -34,4 +34,16 @@ &.divider-right .divider-text { float: right; } +} + +html[data-bs-theme="dark"] { + .divider { + .divider-text { + background-color: #232323 !important; + color: #e0e0e0 !important; + &:before, &:after { + border-top-color: #333 !important; + } + } + } } \ No newline at end of file diff --git a/src/assets/scss/components/_dropdowns.scss b/src/assets/scss/components/_dropdowns.scss index 35aa210..9dd447d 100644 --- a/src/assets/scss/components/_dropdowns.scss +++ b/src/assets/scss/components/_dropdowns.scss @@ -23,4 +23,18 @@ left: 50%; transform: translateX(-50%) } +} +html[data-bs-theme="dark"] { + .dropdown-menu { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .dropdown-item { + color: #e0e0e0 !important; + } + .dropdown-item:hover, .dropdown-item:focus { + background-color: #333 !important; + color: #fff !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_forms.scss b/src/assets/scss/components/_forms.scss index 8336151..aacd339 100644 --- a/src/assets/scss/components/_forms.scss +++ b/src/assets/scss/components/_forms.scss @@ -245,3 +245,29 @@ $choices-highlight-bg: #e9ecef; .choices__list--dropdown .choices__item--selectable.is-highlighted { background-color: $choices-highlight-bg; } + +html[data-bs-theme="dark"] { + .form-control { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .form-label { + color: #e0e0e0 !important; + } +} + +html[data-bs-theme="dark"] .form-select, +html[data-bs-theme="dark"] .form-control { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; +} + +html[data-bs-theme="dark"] .form-select:focus, +html[data-bs-theme="dark"] .form-control:focus { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #1976d2 !important; + box-shadow: 0 0 0 0.2rem rgba(25, 118, 210, 0.25) !important; +} diff --git a/src/assets/scss/components/_icons.scss b/src/assets/scss/components/_icons.scss index d165964..5ccd619 100644 --- a/src/assets/scss/components/_icons.scss +++ b/src/assets/scss/components/_icons.scss @@ -45,4 +45,25 @@ .burger-btn { display:none; +} + +html[data-bs-theme="dark"] { + .stats-icon { + background-color: #333 !important; + i { + color: #e0e0e0 !important; + } + &.purple { + background-color: #6c63ff !important; + } + &.blue { + background-color: #379ecb !important; + } + &.red { + background-color: #d9534f !important; + } + &.green { + background-color: #3bb78f !important; + } + } } \ No newline at end of file diff --git a/src/assets/scss/components/_modal.scss b/src/assets/scss/components/_modal.scss index 873a619..fe581d5 100644 --- a/src/assets/scss/components/_modal.scss +++ b/src/assets/scss/components/_modal.scss @@ -43,4 +43,12 @@ border-top: 0; } } +} + +html[data-bs-theme="dark"] { + .modal-content { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_navbar.scss b/src/assets/scss/components/_navbar.scss index 125f102..79b083b 100644 --- a/src/assets/scss/components/_navbar.scss +++ b/src/assets/scss/components/_navbar.scss @@ -298,4 +298,15 @@ } #topbarUserDropdown:after { margin-left: 1rem; +} + +html[data-bs-theme="dark"] { + .navbar { + background-color: #181818 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .navbar-brand, .navbar-nav .nav-link { + color: #e0e0e0 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_navs.scss b/src/assets/scss/components/_navs.scss index 4fac2cf..369f1ad 100644 --- a/src/assets/scss/components/_navs.scss +++ b/src/assets/scss/components/_navs.scss @@ -29,4 +29,33 @@ box-shadow: 0 2px 5px rgba(map-get($theme-colors, 'primary'),.5); } } +} + +html[data-bs-theme="dark"] { + .nav-tabs { + .nav-link { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + &:hover { + text-shadow: 0 0 2px rgba(map-get($theme-colors, 'primary'), .5); + } + } + .nav-link.active { + background-color: #1976d2 !important; + color: #fff !important; + border-color: #1565c0 !important; + &:after { + background-color: #fff; + box-shadow: 0 2px 5px rgba(#fff, .3); + } + } + } + .nav-pills { + .nav-link.active { + box-shadow: 0 2px 10px rgba(#1976d2, .5); + background-color: #1976d2 !important; + color: #fff !important; + } + } } \ No newline at end of file diff --git a/src/assets/scss/components/_pagination.scss b/src/assets/scss/components/_pagination.scss index b760188..e3d512a 100644 --- a/src/assets/scss/components/_pagination.scss +++ b/src/assets/scss/components/_pagination.scss @@ -36,4 +36,16 @@ &:last-child { margin-left: .4rem; } +} +html[data-bs-theme="dark"] { + .pagination .page-link { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .pagination .page-item.active .page-link { + background-color: #1976d2 !important; + color: #fff !important; + border-color: #1565c0 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_placeholders.scss b/src/assets/scss/components/_placeholders.scss index bceb95e..9e5c84d 100644 --- a/src/assets/scss/components/_placeholders.scss +++ b/src/assets/scss/components/_placeholders.scss @@ -54,3 +54,18 @@ mask-position: -200% 0%; } } + +html[data-bs-theme="dark"] { + .placeholder { + background-color: #232323 !important; + color: #e0e0e0 !important; + } + .placeholder-wave { + mask-image: linear-gradient( + 130deg, + #232323 55%, + rgba(35, 35, 35, (1 - $placeholder-opacity-min)) 75%, + #232323 95% + ); + } +} \ No newline at end of file diff --git a/src/assets/scss/components/_progress.scss b/src/assets/scss/components/_progress.scss index f7f4feb..135bb85 100644 --- a/src/assets/scss/components/_progress.scss +++ b/src/assets/scss/components/_progress.scss @@ -29,4 +29,20 @@ } } +} + +html[data-bs-theme="dark"] { + .progress { + background-color: #232323 !important; + + .progress-bar { + color: #e0e0e0 !important; + // Optionally adjust background for bars if needed + // background-color: darken($value, 10%) !important; + } + + .progress-bar.progress-label:before { + color: #e0e0e0 !important; + } + } } \ No newline at end of file diff --git a/src/assets/scss/components/_sidebar.scss b/src/assets/scss/components/_sidebar.scss index 52c42df..e809752 100644 --- a/src/assets/scss/components/_sidebar.scss +++ b/src/assets/scss/components/_sidebar.scss @@ -216,4 +216,52 @@ to { max-height: 0; } +} + +html[data-bs-theme="dark"] { + .sidebar-wrapper { + background-color: #181818 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + .sidebar-header { + color: #e0e0e0 !important; + } + .menu { + .sidebar-title { + color: #b0b0b0 !important; + } + .sidebar-link { + color: #e0e0e0 !important; + &:hover { + background-color: #222 !important; + } + svg, i { + color: #b0b0b0 !important; + } + } + .sidebar-item.active > .sidebar-link { + background-color: #333 !important; + span { + color: #fff !important; + } + svg, i { + color: #fff !important; + } + } + .submenu { + .submenu-item a { + color: #b0b0b0 !important; + &:hover { + color: #fff !important; + } + } + .submenu-item.active > a { + color: #fff !important; + } + } + } + } + .sidebar-backdrop { + background-color: rgba(0, 0, 0, 0.7) !important; + } } \ No newline at end of file diff --git a/src/assets/scss/components/_table.scss b/src/assets/scss/components/_table.scss index 7bb5a0b..10b4f5f 100644 --- a/src/assets/scss/components/_table.scss +++ b/src/assets/scss/components/_table.scss @@ -64,4 +64,42 @@ } .dataTables_length { margin-bottom: .5rem; +} + +html[data-bs-theme="dark"] { + .table { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + } + .table th, .table td { + border-color: #333 !important; + } + .table thead th { + border-bottom: 1px solid #444 !important; + } + .table-bordered { + border: 1px solid #333 !important; + } + .table-striped tbody tr:nth-of-type(odd) { + background-color: #2a2a2a !important; + } + .table-hover tbody tr:hover { + background-color: #3a3a3a !important; + } + .dataTable-table { + background-color: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; + thead, tbody, tfoot { + tr { + th, td { + border-color: #333 !important; + } + } + } + thead tr th { + border-bottom: 1px solid #444 !important; + } + } } \ No newline at end of file diff --git a/src/assets/scss/pages/auth.scss b/src/assets/scss/pages/auth.scss index 243c79e..7e20eb2 100644 --- a/src/assets/scss/pages/auth.scss +++ b/src/assets/scss/pages/auth.scss @@ -44,7 +44,20 @@ body { html[data-bs-theme="dark"] { @import "../themes/dark/variables-dark"; + body { + background-color: var(--bs-body-bg-dark); + } + #auth-right { - background: url(../../static/images/bg/4853433.png), $page-auth-right-bg; + background: url(../../static/images/bg/4853433.png), $page-auth-right-bg-dark; + } + + #auth-left { + .auth-title { + color: var(--bs-body-color-dark); + } + .auth-subtitle { + color: #cfd4e3; + } } } diff --git a/src/assets/scss/pages/chat.scss b/src/assets/scss/pages/chat.scss index 6f6c8ba..4cfa653 100644 --- a/src/assets/scss/pages/chat.scss +++ b/src/assets/scss/pages/chat.scss @@ -8,9 +8,9 @@ } } .chat-app { - .chat-app-wrapper { + // .chat-app-wrapper { - } + // } .chat-app-right { padding-left: 0; } @@ -18,9 +18,9 @@ .person-name { font-size: 1.2rem; } - .person-status { + // .person-status { - } + // } } .chat-app-body { .left { diff --git a/src/assets/scss/pages/datatables.scss b/src/assets/scss/pages/datatables.scss index a37c36e..2297371 100644 --- a/src/assets/scss/pages/datatables.scss +++ b/src/assets/scss/pages/datatables.scss @@ -15,4 +15,46 @@ table.dataTable td { } div.dataTables_wrapper div.dataTables_info { padding-top: .4em +} + +html[data-bs-theme="dark"] { + table.dataTable { + color: #e0e0e0 !important; + background-color: #232323 !important; + } + table.dataTable th { + color: #e0e0e0 !important; + background-color: #232323 !important; + } + table.dataTable td { + color: #e0e0e0 !important; + background-color: #232323 !important; + } + .dataTables_wrapper .dataTables_paginate .paginate_button { + color: #e0e0e0 !important; + background-color: #232323 !important; + border: 1px solid #333 !important; + } + .dataTables_wrapper .dataTables_paginate .paginate_button.current, + .dataTables_wrapper .dataTables_paginate .paginate_button:hover { + background-color: #5A8DEE !important; + color: white !important; + border: none !important; + } + .dataTables_wrapper .dataTables_filter input { + background-color: #232323 !important; + color: #e0e0e0 !important; + border: 1px solid #333 !important; + } + .dataTables_wrapper .dataTables_length select { + background-color: #232323 !important; + color: #e0e0e0 !important; + border: 1px solid #333 !important; + } + .dataTables_wrapper .dataTables_info { + color: #e0e0e0 !important; + } + .dataTables_wrapper .dataTables_filter label { + color: #e0e0e0 !important; + } } \ No newline at end of file diff --git a/src/assets/scss/pages/dripicons.scss b/src/assets/scss/pages/dripicons.scss index d7bdaf5..b873fc4 100644 --- a/src/assets/scss/pages/dripicons.scss +++ b/src/assets/scss/pages/dripicons.scss @@ -17,4 +17,4 @@ .glyphs.css-mapping .icon{margin:0;margin-right:10px;padding:13px;height:50px;width:50px;color:#398FF7 !important;overflow:hidden;float:left;font-size:24px} .glyphs.css-mapping input{background:none;color:#398FF7;margin:0;margin-top:5px;padding:8px;line-height:14px;font-size:14px;font-family:'Montserrat','Helvetica','Arial',sans-serif;font-weight:700;display:block;width:120px;height:40px;border:none;-webkit-border-radius:5px;border-radius:5px;outline:none;float:right;} .glyphs.css-mapping input:focus{border:none;} -.glyphs.css-mapping input:hover{} \ No newline at end of file +// .glyphs.css-mapping input:hover{} \ No newline at end of file diff --git a/src/assets/scss/pages/email.scss b/src/assets/scss/pages/email.scss index cd81a6f..48db582 100644 --- a/src/assets/scss/pages/email.scss +++ b/src/assets/scss/pages/email.scss @@ -599,9 +599,6 @@ html[data-bs-theme="dark"] { } } - - - .action-icon, .action-button, .form-control { diff --git a/src/assets/scss/pages/form-element-select.scss b/src/assets/scss/pages/form-element-select.scss index 98b883e..68939ab 100644 --- a/src/assets/scss/pages/form-element-select.scss +++ b/src/assets/scss/pages/form-element-select.scss @@ -1,7 +1,7 @@ - .choices__list--multiple .choices__item { border-radius: 2px; background-color: #5A8DEE; box-shadow: 0 2px 5px rgb(2 158 255 / 10%); border: none; } + diff --git a/src/assets/scss/themes/dark/_mazer-dark.scss b/src/assets/scss/themes/dark/_mazer-dark.scss index dafa7e1..4914421 100644 --- a/src/assets/scss/themes/dark/_mazer-dark.scss +++ b/src/assets/scss/themes/dark/_mazer-dark.scss @@ -1,3 +1,5 @@ +html[data-bs-theme="dark"] { + .toast .btn-close { background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; } @@ -83,3 +85,4 @@ } } } +} \ No newline at end of file diff --git a/src/assets/scss/widgets/todo.scss b/src/assets/scss/widgets/todo.scss index fc12c4c..ff88b2a 100644 --- a/src/assets/scss/widgets/todo.scss +++ b/src/assets/scss/widgets/todo.scss @@ -10,7 +10,7 @@ min-width: 400px; } -[data-bs-theme="dark"] .widget-todo-item:hover { +.widget-todo-item:hover { background-color: $gray-900; } .widget-todo-title-wrapper { @@ -39,4 +39,19 @@ cursor: move; height: 1rem } +} + +html[data-bs-theme="dark"] .widget-todo-item:hover { + background-color: $gray-800; +} +html[data-bs-theme="dark"] .widget-todo-item { + background-color: $gray-900; + color: $gray-100; + + &:hover { + background-color: $gray-800; + } +} +html[data-bs-theme="dark"] .widget-todo-title-area svg { + fill: $gray-100; } \ No newline at end of file diff --git a/src/assets/static/js/components/dark.js b/src/assets/static/js/components/dark.js index ab2d5e2..e3f1b3f 100644 --- a/src/assets/static/js/components/dark.js +++ b/src/assets/static/js/components/dark.js @@ -1,7 +1,6 @@ - const THEME_KEY = "theme" -function toggleDarkTheme() { +export function toggleDarkTheme() { setTheme( document.documentElement.getAttribute("data-bs-theme") === 'dark' ? "light" @@ -14,7 +13,7 @@ function toggleDarkTheme() { * @param {"dark"|"light"} theme * @param {boolean} persist */ -function setTheme(theme, persist = false) { +export function setTheme(theme, persist = false) { document.body.classList.add(theme) document.documentElement.setAttribute('data-bs-theme', theme) @@ -26,7 +25,7 @@ function setTheme(theme, persist = false) { /** * Init theme from setTheme() */ -function initTheme() { +export function initTheme() { //If the user manually set a theme, we'll load that const storedTheme = localStorage.getItem(THEME_KEY) if (storedTheme) { diff --git a/src/components/AgendarConsulta/style/formagendamentos.css b/src/components/AgendarConsulta/style/formagendamentos.css index 4c3fe80..f9ca9d7 100644 --- a/src/components/AgendarConsulta/style/formagendamentos.css +++ b/src/components/AgendarConsulta/style/formagendamentos.css @@ -15,7 +15,6 @@ color: white; } - .icons-div{ border: 1px solid #607080; padding: 10px; @@ -220,4 +219,88 @@ select[name=solicitante]{ box-shadow: 0 4px 12px rgba(0,0,0,0.08); border: 10px solid #ffffff; box-sizing: border-box; +} + +html[data-bs-theme="dark"] .form-container { + background: #232323 !important; + color: #e0e0e0 !important; + border: 1px solid #404053 !important; +} + +html[data-bs-theme="dark"] .form-title, +html[data-bs-theme="dark"] .section-title { + color: #90cdf4 !important; +} + +html[data-bs-theme="dark"] .section-subtitle { + color: #b0b7c3 !important; +} + +html[data-bs-theme="dark"] .form-agendamento label { + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .form-agendamento input, +html[data-bs-theme="dark"] .form-agendamento select, +html[data-bs-theme="dark"] .form-agendamento textarea { + background: #181818 !important; + color: #e0e0e0 !important; + border: 1px solid #404053 !important; +} + +html[data-bs-theme="dark"] .btn-group button { + background: #232323 !important; + color: #e0e0e0 !important; + border: 1px solid #404053 !important; +} + +html[data-bs-theme="dark"] .btn-group button:hover { + background: #404053 !important; +} + +html[data-bs-theme="dark"] .btn-primary { + background: #2563eb !important; + color: #fff !important; +} + +html[data-bs-theme="dark"] .btn-primary:hover { + background: #1e40af !important; +} + +html[data-bs-theme="dark"] .btn-cancel { + background: #404053 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .btn-cancel:hover { + background: #232323 !important; +} + +html[data-bs-theme="dark"] .btn-secondary { + background: #374151 !important; + color: #e0e0e0 !important; + border: 1px solid #404053 !important; +} + +html[data-bs-theme="dark"] .btn-secondary:hover { + background: #232323 !important; +} + +html[data-bs-theme="dark"] .icons-div { + border: 1px solid #404053 !important; + background: #232323 !important; +} + +html[data-bs-theme="dark"] .icons-div:hover { + background: #2563eb !important; +} + +html[data-bs-theme="dark"] .icons-div:hover svg, +html[data-bs-theme="dark"] .icons-div:hover .icon { + color: #fff !important; +} + +html[data-bs-theme="dark"] .icon, +html[data-bs-theme="dark"] svg { + color: #e0e0e0 !important; } \ No newline at end of file diff --git a/src/components/AgendarConsulta/style/styleTabelas/tabeladia.css b/src/components/AgendarConsulta/style/styleTabelas/tabeladia.css index 3a1dc16..6228433 100644 --- a/src/components/AgendarConsulta/style/styleTabelas/tabeladia.css +++ b/src/components/AgendarConsulta/style/styleTabelas/tabeladia.css @@ -69,3 +69,49 @@ font-weight: 600; align-items: flex-start; height: 70px; } + +html[data-bs-theme="dark"] .tabeladiaria { + border: 4px solid #333; + box-shadow: 0 4px 12px rgba(0,0,0,0.5); + background-color: #232323; +} + +html[data-bs-theme="dark"] .tabeladiaria th, +html[data-bs-theme="dark"] .tabeladiaria td { + border: 1px solid #333; + color: #e0e0e0; + background-color: #232323; +} + +html[data-bs-theme="dark"] .tabeladiaria thead th { + background-color: #222e3c; + color: #aee2ff; + border-bottom: 2px solid #333; +} + +html[data-bs-theme="dark"] .tabeladiaria tbody tr:nth-child(even) { + background-color: #232a34; +} + +html[data-bs-theme="dark"] .tabeladiaria tbody tr:hover, +html[data-bs-theme="dark"] .tabeladiaria tbody tr:hover td { + background-color: #2c3642 !important; +} + +html[data-bs-theme="dark"] .tabeladiaria .cardconsulta { + background-color: #232323; + color: #e0e0e0; + box-shadow: 0 1px 3px rgba(0,0,0,0.3); + border-left: 5px solid #333; +} + +html[data-bs-theme="dark"] .container-cardconsulta-dia { + background-color: transparent; +} + +html[data-bs-theme="dark"] .mostrar-horario td, +html[data-bs-theme="dark"] .mostrar-horario th { + border: 1px solid #333; + color: #e0e0e0; + background-color: #232323; +} \ No newline at end of file diff --git a/src/components/AgendarConsulta/style/styleTabelas/tabelames.css b/src/components/AgendarConsulta/style/styleTabelas/tabelames.css index fbce17b..5fbe05c 100644 --- a/src/components/AgendarConsulta/style/styleTabelas/tabelames.css +++ b/src/components/AgendarConsulta/style/styleTabelas/tabelames.css @@ -106,9 +106,6 @@ border-left: 5px solid transparent; /* espaço da borda colorida */ } - - - .usuario-azul { background-color: #E3F2FD; border-left: 4px solid #2196F3; @@ -153,4 +150,73 @@ color: #005a9e; font-weight: bold; font-size: larger; +} + +html[data-bs-theme="dark"] .tabelamensal { + border: 4px solid #333; + box-shadow: 0 4px 12px rgba(0,0,0,0.5); + background-color: #232323; +} + +html[data-bs-theme="dark"] .tabelamensal th, +html[data-bs-theme="dark"] .tabelamensal thead th { + background-color: #222e3c; + color: #aee2ff; + border-bottom: 2px solid #333; +} + +html[data-bs-theme="dark"] .tabelamensal td { + background-color: #232323; + color: #e0e0e0; + border: 1px solid #333; +} + +html[data-bs-theme="dark"] .tabelamensal tbody tr:nth-child(even) { + background-color: #232a34; +} + +html[data-bs-theme="dark"] .tabelamensal tbody tr:hover, +html[data-bs-theme="dark"] .tabelamensal td:hover { + background-color: #2c3642 !important; +} + +html[data-bs-theme="dark"] .tabelamensal .cardconsulta { + background-color: #232323; + color: #e0e0e0; + box-shadow: 0 1px 3px rgba(0,0,0,0.3); + border-left: 5px solid #333; +} + +html[data-bs-theme="dark"] .usuario-azul { + background-color: #1565c0; + border-left: 4px solid #2196F3; + color: #e3f2fd; +} + +html[data-bs-theme="dark"] .usuario-verde { + background-color: #388e3c; + border-left: 4px solid #4CAF50; + color: #e8f5e9; +} + +html[data-bs-theme="dark"] .usuario-roxo { + background-color: #6a1b9a; + border-left: 4px solid #9C27B0; + color: #f3e5f5; +} + +html[data-bs-theme="dark"] .usuario-laranja { + background-color: #f57c00; + border-left: 4px solid #FF9800; + color: #fff3e0; +} + +html[data-bs-theme="dark"] .usuario-default { + background-color: #424242; + border-left: 4px solid #BDBDBD; + color: #fafafa; +} + +html[data-bs-theme="dark"] .cards-que-faltam { + color: #90caf9; } \ No newline at end of file diff --git a/src/components/AgendarConsulta/style/styleTabelas/tabelasemana.css b/src/components/AgendarConsulta/style/styleTabelas/tabelasemana.css index d5b9146..fbedcf1 100644 --- a/src/components/AgendarConsulta/style/styleTabelas/tabelasemana.css +++ b/src/components/AgendarConsulta/style/styleTabelas/tabelasemana.css @@ -25,7 +25,6 @@ border-bottom: 2px solid #005a9e; } - /* Remover bordas laterais do cabeçalho (se quiser) */ .tabelasemanal thead th:first-child { border-left: none; @@ -71,4 +70,44 @@ tr{ width: 1000px; +} + +html[data-bs-theme="dark"] .tabelasemanal { + border: 4px solid #333; + box-shadow: 0 4px 12px rgba(0,0,0,0.5); + background-color: #232323 !important; +} + +html[data-bs-theme="dark"] .tabelasemanal th, +html[data-bs-theme="dark"] .tabelasemanal td { + border: 1px solid #333; + color: #e0e0e0; + background-color: #232323; +} + +html[data-bs-theme="dark"] .tabelasemanal thead th, +html[data-bs-theme="dark"] .tabelasemanal thead td { + background-color: #222e3c; + color: #aee2ff; + border-bottom: 2px solid #333; +} + +html[data-bs-theme="dark"] .tabelasemanal tbody tr:nth-child(even) { + background-color: #232a34 +} + +html[data-bs-theme="dark"] .tabelasemanal tbody tr:nth-child(odd) { + background-color: #232323 +} + +html[data-bs-theme="dark"] .tabelasemanal tbody tr:hover, +html[data-bs-theme="dark"] .tabelasemanal tbody tr:hover td { + background-color: #2c3642 !important; +} + +html[data-bs-theme="dark"] .tabelasemanal .cardconsulta { + background-color: #232323; + color: #e0e0e0; + box-shadow: 0 1px 3px rgba(0,0,0,0.3); + border-left: 5px solid #333; } \ No newline at end of file diff --git a/src/components/botaoacessibilidade.css b/src/components/botaoacessibilidade.css index 4fc533f..7046e09 100644 --- a/src/components/botaoacessibilidade.css +++ b/src/components/botaoacessibilidade.css @@ -12,6 +12,7 @@ display: flex; flex-direction: column; align-items: center; + pointer-events: none; /* Impede cliques no contêiner */ } .botao-flutuante-acessibilidade { @@ -30,6 +31,7 @@ align-items: center; transition: transform 0.2s ease-in-out, box-shadow 0.2s ease; margin-top: 15px; /* Distância do menu */ + pointer-events: auto; /* Permite que o botão seja clicável */ } .botao-flutuante-acessibilidade:hover { @@ -53,6 +55,7 @@ opacity: 0; visibility: hidden; transition: all 0.2s ease; + pointer-events: auto; /* Permite que o menu seja clicável */ } .menu-opcoes.aberto { @@ -196,3 +199,74 @@ text-align: center; transition: color 0.2s ease; } + +/* Dark mode styles */ +html[data-bs-theme="dark"] { + + /* Floating button */ + .botao-flutuante-acessibilidade { + background: linear-gradient(45deg, #212529, #343a40); + color: #f8f9fa; + box-shadow: 0 5px 15px rgba(33, 37, 41, 0.4); + } + .botao-flutuante-acessibilidade:hover { + box-shadow: 0 8px 20px rgba(33, 37, 41, 0.5); + } + + /* Menu balloon */ + .menu-opcoes { + background-color: #23272b; + border: 1px solid #343a40; + box-shadow: 0 8px 25px rgba(0,0,0,0.4); + } + .menu-titulo { + color: #adb5bd; + border-bottom: 1px solid #343a40; + } + + /* Menu buttons and checkbox */ + .menu-opcoes button, + .checkbox-label-button { + color: #f8f9fa; + } + .menu-opcoes button:hover, + .checkbox-label-button:hover { + background-color: #343a40; + } + + /* Checkbox switch */ + .checkbox-label-button input[type="checkbox"] { + background-color: #495057; + } + .checkbox-label-button input[type="checkbox"]:checked { + background-color: #0d6efd; + } + .checkbox-label-button input[type="checkbox"]::before { + background-color: #f8f9fa; + } + + /* Font size control */ + .font-size-control { + color: #f8f9fa; + border-top: 1px solid #343a40; + } + .font-size-label { + color: #f8f9fa; + } + .font-size-buttons button { + background-color: #343a40; + color: #f8f9fa; + border: 1px solid #495057; + } + .font-size-buttons button:hover { + background-color: #495057; + } + .font-size-buttons button:disabled { + background-color: #23272b; + color: #6c757d; + border-color: #343a40; + } + .font-size-display { + color: #f8f9fa; + } +} diff --git a/src/components/botaoacessibilidade.jsx b/src/components/botaoacessibilidade.jsx index 2ea8936..02a564d 100644 --- a/src/components/botaoacessibilidade.jsx +++ b/src/components/botaoacessibilidade.jsx @@ -1,5 +1,6 @@ import React, { useState, useEffect, useRef } from 'react'; import './botaoacessibilidade.css'; // Importando o CSS +import { setTheme } from '../assets/static/js/components/dark'; function BotaoAcessibilidade() { const [isMenuOpen, setIsMenuOpen] = useState(false); @@ -7,6 +8,10 @@ function BotaoAcessibilidade() { const [isDarkMode, setIsDarkMode] = useState(false); const lastSpokenTargetRef = useRef(null); + useEffect(() => { + setTheme(isDarkMode ? "dark" : "light", true); + }, [isDarkMode]); + useEffect(() => { if (!isReadOnHoverActive) { window.speechSynthesis.cancel(); diff --git a/src/pages/LaudoManager.jsx b/src/pages/LaudoManager.jsx index 83b0680..8276a9c 100644 --- a/src/pages/LaudoManager.jsx +++ b/src/pages/LaudoManager.jsx @@ -1,40 +1,6 @@ // src/pages/LaudoManager.jsx import React, { useState, useEffect } from "react"; - -/* ===== Estilos embutidos ===== */ -/* Eu coloquei os estilos aqui para simplificar a edição. */ -const styles = ` -.laudo-wrap { display:flex; gap:24px; padding:18px; font-family: Inter, Roboto, Arial, sans-serif; } -.left-col { width: 100%; max-width: 1160px; background:#ffffff; border-radius:8px; padding:18px; box-shadow: 0 1px 0 rgba(0,0,0,0.03); } /* <-- fundo branco */ -.title-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; } -.page-title { font-size:20px; color:#2b4a78; font-weight:700; } -.laudo-row { display:flex; padding:14px 12px; align-items:center; border-bottom:1px solid #eef3f8; position:relative; overflow:visible; background: transparent; } -.col { flex:1; padding:0 8px; font-size:14px; color:#2e3a4b; } -.col.small { flex:0 0 90px; text-align:right; } -.row-actions { position:relative; flex: 0 0 88px; display:flex; justify-content:flex-end; } -.action-btn { background:transparent; border:1px solid #d7e6fb; border-radius:8px; height:40px; width:40px; display:flex; align-items:center; justify-content:center; cursor:pointer; } -.dropdown { position:absolute; right:0; top:48px; background:white; border-radius:8px; box-shadow: 0 10px 30px rgba(20,30,50,0.12); min-width:220px; padding:8px 0; z-index:9999; } -.dropdown .item { padding:12px 18px; cursor:pointer; font-size:15px; color:#244056; } -.dropdown .item:hover { background:#f6fbff; } -.viewer-modal, .preview-modal, .confirm-modal { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:12000; pointer-events:none; } /* deixar pointer-events none para que não bloqueie por padrão */ -.modal-backdrop { position:absolute; inset:0; background: rgba(9,20,40,0.45); pointer-events:auto; } /* usado apenas quando necessário */ -.modal-card { position:relative; width:92%; max-width:1100px; background:white; border-radius:10px; padding:18px; box-shadow: 0 10px 60px rgba(10,20,40,0.25); max-height:88vh; overflow:auto; pointer-events:auto; } -.viewer-header { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:12px; } -.patient-info { font-size:13px; color:#3a556b; } -.toolbar { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:12px; } -.tool-btn { padding:8px 10px; border-radius:6px; border:1px solid #e6eef8; cursor:pointer; background:#fff; font-size:13px; } -.editor-area { border:1px solid #e6eef8; border-radius:8px; padding:14px; min-height:360px; background: #fff; color:#1f2d3d; font-size:15px; line-height:1.5; } -.footer-controls { display:flex; justify-content:space-between; align-items:center; margin-top:12px; } -.toggle { display:flex; align-items:center; gap:8px; } -.btn { padding:8px 12px; border-radius:8px; border:none; cursor:pointer; font-weight:600; } -.btn.secondary { background:#eef6ff; color:#2f63a6; border:1px solid #d6e9ff; } -.btn.primary { background:#2f63a6; color:white; } -.small-muted { color:#7f95a8; font-size:13px; } -.empty { padding:40px; text-align:center; color:#7d97b4; } - -/* notificação simples (centralizada) */ -.notice-card { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:8px; padding:14px 18px; box-shadow:0 8px 30px rgba(10,20,40,0.12); z-index:13000; pointer-events:auto; max-width:720px; } -`; +import "./LaudoStyle.css"; // Importa o CSS externo /* ===== Mock data (simula APIDOG) ===== */ function mockFetchLaudos() { @@ -101,12 +67,9 @@ export default function LaudoManager() { const isSecretary = true; // permanece true (somente leitura) useEffect(() => { - const el = document.createElement("style"); - el.innerHTML = styles; - document.head.appendChild(el); + // Importa os dados mock apenas const data = mockFetchLaudos(); setLaudos(data); - return () => document.head.removeChild(el); }, []); // Fecha dropdown ao clicar fora @@ -228,7 +191,7 @@ export default function LaudoManager() {
toggleDropdown(l.id, e)} title="Ações"> - +
{openDropdownId === l.id && ( diff --git a/src/pages/LaudoStyle.css b/src/pages/LaudoStyle.css new file mode 100644 index 0000000..31f1542 --- /dev/null +++ b/src/pages/LaudoStyle.css @@ -0,0 +1,312 @@ +.laudo-wrap { + display:flex; + gap:24px; + padding:18px; + font-family: Inter, Roboto, Arial, sans-serif; +} +.left-col { + width: 100%; + max-width: 1160px; + background:#ffffff; + border-radius:8px; + padding:18px; + box-shadow: 0 1px 0 rgba(0,0,0,0.03); +} +.title-row { + display:flex; + justify-content:space-between; + align-items:center; + margin-bottom:12px; +} +.page-title { + font-size:20px; + color:#2b4a78; + font-weight:700; +} +.laudo-row { + display:flex; + padding:14px 12px; + align-items:center; + border-bottom:1px solid #eef3f8; + position:relative; + overflow:visible; + background: transparent; +} +.col { + flex:1; + padding:0 8px; + font-size:14px; + color:#2e3a4b; +} +.col.small { + flex: 0 0 90px; + text-align: right; +} +.row-actions { + position: relative; + flex: 0 0 88px; + display: flex; + justify-content: flex-end; +} + +.action-btn { + background: transparent; + border: 1px solid #d7e6fb; + border-radius: 8px; + height: 40px; + width: 40px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} + +.dropdown { + position: absolute; + right: 0; + top: 48px; + background: white; + border-radius: 8px; + box-shadow: 0 10px 30px rgba(20,30,50,0.12); + min-width: 220px; + padding: 8px 0; + z-index: 9999; +} + +.dropdown .item { + padding: 12px 18px; + cursor: pointer; + font-size: 15px; + color: #244056; +} + +.dropdown .item:hover { + background: #f6fbff; +} + +.viewer-modal, +.preview-modal, +.confirm-modal { + position: fixed; + inset: 0; + display: flex; + align-items: center; + justify-content: center; + z-index: 12000; + pointer-events: none; +} /* deixar pointer-events none para que não bloqueie por padrão */ + +.modal-backdrop { + position: absolute; + inset: 0; + background: rgba(9,20,40,0.45); + pointer-events: auto; +} /* usado apenas quando necessário */ + +.modal-card { + position: relative; + width: 92%; + max-width: 1100px; + background: white; + border-radius: 10px; + padding: 18px; + box-shadow: 0 10px 60px rgba(10,20,40,0.25); + max-height: 88vh; + overflow: auto; + pointer-events: auto; +} + +.viewer-header { + display: flex; + justify-content: space-between; + align-items: flex-start; + gap: 10px; + margin-bottom: 12px; +} + +.patient-info { + font-size: 13px; + color: #3a556b; +} + +.toolbar { + display: flex; + gap: 8px; + align-items: center; + flex-wrap: wrap; + margin-bottom: 12px; +} + +.tool-btn { + padding: 8px 10px; + border-radius: 6px; + border: 1px solid #e6eef8; + cursor: pointer; + background: #fff; + font-size: 13px; +} + +.editor-area { + border: 1px solid #e6eef8; + border-radius: 8px; + padding: 14px; + min-height: 360px; + background: #fff; + color: #1f2d3d; + font-size: 15px; + line-height: 1.5; +} + +.footer-controls { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 12px; +} + +.toggle { + display: flex; + align-items: center; + gap: 8px; +} + +.btn { + padding: 8px 12px; + border-radius: 8px; + border: none; + cursor: pointer; + font-weight: 600; +} + +.btn.secondary { + background: #eef6ff; + color: #2f63a6; + border: 1px solid #d6e9ff; +} + +.btn.primary { + background: #2f63a6; + color: white; +} + +.small-muted { + color: #7f95a8; + font-size: 13px; +} + +.empty { + padding: 40px; + text-align: center; + color: #7d97b4; +} + +/* notificação simples (centralizada) */ +.notice-card { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:8px; padding:14px 18px; box-shadow:0 8px 30px rgba(10,20,40,0.12); z-index:13000; pointer-events:auto; max-width:720px; } + +/* Dark mode styles remain as you have them */ +html[data-bs-theme="dark"] { + background: #181818 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .laudo-wrap { + background: transparent !important; +} + +html[data-bs-theme="dark"] .left-col { + background: #232323 !important; + box-shadow: 0 1px 0 rgba(0,0,0,0.08) !important; + border-radius: 8px !important; +} + +html[data-bs-theme="dark"] .title-row { + border-bottom: 1px solid #333 !important; +} + +html[data-bs-theme="dark"] .page-title { + color: #90caf9 !important; +} + +html[data-bs-theme="dark"] .laudo-row { + background: transparent !important; + border-bottom: 1px solid #333 !important; +} + +html[data-bs-theme="dark"] .col { + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .col.small { + color: #90caf9 !important; +} + +html[data-bs-theme="dark"] .action-btn { + background: transparent !important; + border: 1px solid #e0e0e0 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .dropdown { + background: #232323 !important; + box-shadow: 0 10px 30px rgba(20,30,50,0.32) !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .dropdown .item { + color: #90caf9 !important; +} + +html[data-bs-theme="dark"] .dropdown .item:hover { + background: #2c3642 !important; +} + +html[data-bs-theme="dark"] .modal-backdrop { + background: rgba(9,20,40,0.65) !important; +} + +html[data-bs-theme="dark"] .modal-card { + background: #232323 !important; + color: #e0e0e0 !important; + box-shadow: 0 10px 60px rgba(10,20,40,0.45) !important; +} + +html[data-bs-theme="dark"] .patient-info { + color: #90caf9 !important; +} + +html[data-bs-theme="dark"] .tool-btn { + background: #232323 !important; + border: 1px solid #333 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .editor-area { + background: #232323 !important; + color: #e0e0e0 !important; + border: 1px solid #333 !important; +} + +html[data-bs-theme="dark"] .btn.secondary { + background: #232323 !important; + color: #90caf9 !important; + border: 1px solid #333 !important; +} + +html[data-bs-theme="dark"] .btn.primary { + background: #1976d2 !important; + color: #fff !important; +} + +html[data-bs-theme="dark"] .small-muted { + color: #7f95a8 !important; +} + +html[data-bs-theme="dark"] .empty { + color: #7d97b4 !important; +} + +html[data-bs-theme="dark"] .notice-card { + background: #232323 !important; + color: #e0e0e0 !important; + box-shadow: 0 8px 30px rgba(10,20,40,0.32) !important; +} \ No newline at end of file diff --git a/src/pages/TablePaciente.jsx b/src/pages/TablePaciente.jsx index a82e63d..52a7854 100644 --- a/src/pages/TablePaciente.jsx +++ b/src/pages/TablePaciente.jsx @@ -270,7 +270,7 @@ const pacientesFiltrados = Array.isArray(pacientes) ? pacientes.filter((paciente className="btn btn-sm" style={{ backgroundColor: "#E6F2FF", - color: "#004085", + color: "#004085!important", }} onClick={() => { diff --git a/src/pages/style/Agendamento.css b/src/pages/style/Agendamento.css index e5d4de4..8df2e11 100644 --- a/src/pages/style/Agendamento.css +++ b/src/pages/style/Agendamento.css @@ -4,6 +4,7 @@ border-radius: 5px; border: 1px solid #ccc; } + .btn-buscar { padding: 0.5rem 1rem; margin-right: 0.5rem; @@ -13,15 +14,12 @@ cursor: pointer; } - .unidade-selecionarprofissional{ background-color: #fdfdfdde; padding: 20px 10px; display: flex; border-radius:10px ; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); - - } .unidade-selecionarprofissional input, .unidade-selecionarprofissional select { @@ -68,25 +66,18 @@ .btn-selecionar-tabeladia{ border-radius: 10px 0px 0px 10px; - - } .btn-selecionar-tabelames{ border-radius: 0px 10px 10px 0px; } - .btn-selecionar-tabeladia.ativo, .btn-selecionar-tabelasemana.ativo, .btn-selecionar-tabelames.ativo{ background-color: lightcyan; border-color: darkcyan; font-weight: bolder; - - } - - .legenda-tabela{ display: flex; @@ -127,7 +118,6 @@ border-radius: 10px; } - #status-card-consulta-confirmado, .legenda-item-confirmado { background-color: #eef8fb; border:3px solid #d8dfe7; @@ -144,18 +134,14 @@ border-radius: 10px; } -.btns-e-legenda-container{ - +.btns-e-legenda-container{ display: flex; - justify-content: space-between; flex-direction: row; margin-top: 10px; } - .calendario { - border-collapse: collapse; width: 100%; border-radius: 10px; @@ -165,8 +151,6 @@ background-color: rgb(253, 253, 253); } - - .calendario-ou-filaespera{ margin-top: 0; } @@ -177,7 +161,6 @@ flex-direction: row; gap: 20px; margin-left:20px ; - } .btn-fila-espera, .btn-agenda{ @@ -187,10 +170,122 @@ padding: 8px; border-radius: 10px 10px 0px 0px; font-weight: bold; - } .opc-filaespera-ativo, .opc-agenda-ativo{ color: white; background-color: #5980fd; +} + +html[data-bs-theme="dark"] { + body { + background-color: #121212; + color: #e0e0e0; + } + + .calendario { + background-color: #1e1e1e; + border: 10px solid #333; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5); + } + + .unidade-selecionarprofissional { + background-color: #1e1e1e; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5); + } + + .unidade-selecionarprofissional input, + .unidade-selecionarprofissional select, + .busca-atendimento select, + .busca-atendimento input { + background-color: #2c2c2c; + color: #e0e0e0; + border: 1px solid #444; + } + + .btn-buscar, + .btn-selecionar-tabeladia, + .btn-selecionar-tabelasemana, + .btn-selecionar-tabelames { + background-color: #2c2c2c; + color: #e0e0e0; + border: none; + } + + .btn-selecionar-tabeladia.ativo, + .btn-selecionar-tabelasemana.ativo, + .btn-selecionar-tabelames.ativo { + background-color: #005a9e; + border-color: #004578; + color: #fff; + } + + .legenda-item-realizado { + background-color: #14532d; + border-color: #166534; + } + + .legenda-item-confirmado { + background-color: #1e3a8a; + border-color: #2563eb; + } + + .legenda-item-cancelado { + background-color: #7f1d1d; + border-color: #dc2626; + } + + .legenda-item-agendado { + background-color: #78350f; + border-color: #f59e0b; + } + + #status-card-consulta-realizado, + .legenda-item-realizado { + background-color: #14532d; + border: 3px solid #166534; + color: #e0e0e0; + } + + #status-card-consulta-cancelado, + .legenda-item-cancelado { + background-color: #7f1d1d; + border: 3px solid #dc2626; + color: #e0e0e0; + } + + #status-card-consulta-confirmado, + .legenda-item-confirmado { + background-color: #1e3a8a; + border: 3px solid #2563eb; + color: #e0e0e0; + } + + #status-card-consulta-agendado, + .legenda-item-agendado { + background-color: #78350f; + border: 3px solid #f59e0b; + color: #e0e0e0; + } + + .btns-e-legenda-container { + background-color: #181818; + } + + .container-btns-agenda-fila_esepera { + background-color: #181818; + } + + .btn-fila-espera, + .btn-agenda { + background-color: #2c2c2c; + color: #e0e0e0; + border-bottom: 3px solid #333; + } + + .opc-filaespera-ativo, + .opc-agenda-ativo { + color: #fff; + background-color: #005a9e; + } } \ No newline at end of file diff --git a/src/pages/style/FilaEspera.css b/src/pages/style/FilaEspera.css index 3cdc41a..358a21f 100644 --- a/src/pages/style/FilaEspera.css +++ b/src/pages/style/FilaEspera.css @@ -286,3 +286,40 @@ html, body { font-size: 1.5rem; text-align: center; } + +html[data-bs-theme="dark"] .fila-container { + background: #232323 !important; + color: #e0e0e0 !important; + border-color: #333 !important; +} + +html[data-bs-theme="dark"] .fila-titulo { + color: #e0e0e0 !important; + border-bottom: 2px solid #444 !important; +} + +html[data-bs-theme="dark"] .fila-tabela th { + background-color: #333 !important; + color: #e0e0e0 !important; +} + +html[data-bs-theme="dark"] .fila-tabela tbody tr:nth-child(even) { + background-color: #2a2a2a !important; +} +html[data-bs-theme="dark"] .fila-tabela tbody tr:nth-child(odd) { + background-color: #232323 !important; +} + +html[data-bs-theme="dark"] .fila-tabela tbody tr:hover { + background-color: #2d3540 !important; +} + +html[data-bs-theme="dark"] .busca-fila-espera { + background: #232323 !important; + color: #e0e0e0 !important; + border-color: #444 !important; +} + +html[data-bs-theme="dark"] .busca-fila-espera:focus { + border-color: #5980fd !important; +} \ No newline at end of file diff --git a/src/pages/style/FinanceiroDashboard.css b/src/pages/style/FinanceiroDashboard.css index b993509..d9caac7 100644 --- a/src/pages/style/FinanceiroDashboard.css +++ b/src/pages/style/FinanceiroDashboard.css @@ -275,4 +275,95 @@ textarea { padding: 40px; color: #7d97b4; font-size: 16px; +} + +html[data-bs-theme="dark"] .financeiro-wrap { + background-color: #121212; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .list-page-card { + background-color: #1e1e1e; + box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -2px rgba(0, 0, 0, 0.5); +} + +html[data-bs-theme="dark"] .table-container th { + background: #2c2c2c; + color: #cbd5e1; +} + +html[data-bs-theme="dark"] .table-container th, +html[data-bs-theme="dark"] .table-container td { + border-bottom: 1px solid #333; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .table-container tr:nth-child(even) { + background-color: #1a1a1a; +} + +html[data-bs-theme="dark"] .table-container tr:hover { + background-color: #333 !important; +} + +html[data-bs-theme="dark"] .action-btn { + background: #2c2c2c; + border: 1px solid #444 !important; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .action-btn:hover { + background: #3a3a3a !important; + border-color: #666 !important; +} + +html[data-bs-theme="dark"] .action-btn.delete { + border-color: #f87171 !important; + color: #fca5a5 !important; +} + +html[data-bs-theme="dark"] .action-btn.delete:hover { + background: #7f1d1d !important; + border-color: #f87171 !important; +} + +html[data-bs-theme="dark"] .badge.pago { + background: #064e3b !important; + color: #d1fae5; +} + +html[data-bs-theme="dark"] .badge.pendente { + background: #78350f !important; + color: #fef3c7; +} + +html[data-bs-theme="dark"] .badge.vencido { + background: #7f1d1d !important; + color: #fee2e2; +} + +html[data-bs-theme="dark"] .modal-card { + background: #1e1e1e; + color: #e0e0e0; + box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.5); +} + +html[data-bs-theme="dark"] .modal-header h2 { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .input-field, +html[data-bs-theme="dark"] .select-field, +html[data-bs-theme="dark"] textarea { + background-color: #23272f; + color: #e0e0e0; + border: 1px solid #444; +} + +html[data-bs-theme="dark"] .input-field:focus, +html[data-bs-theme="dark"] .select-field:focus, +html[data-bs-theme="dark"] textarea:focus { + border-color: #3b82f6; + box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25); + outline: none; } \ No newline at end of file diff --git a/src/pages/style/Inicio.css b/src/pages/style/Inicio.css index c7eb6a3..889e7bf 100644 --- a/src/pages/style/Inicio.css +++ b/src/pages/style/Inicio.css @@ -179,4 +179,53 @@ .manage-button:hover { background-color: #4444ff; +} + +html[data-bs-theme="dark"] .dashboard-container { + background-color: #121212; + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .dashboard-header h1, +html[data-bs-theme="dark"] .dashboard-header p, +html[data-bs-theme="dark"] .quick-actions h2, +html[data-bs-theme="dark"] .appointments-section h2, +html[data-bs-theme="dark"] .action-title, +html[data-bs-theme="dark"] .stat-value { + color: #e0e0e0; +} + +html[data-bs-theme="dark"] .stat-card, +html[data-bs-theme="dark"] .action-button, +html[data-bs-theme="dark"] .appointments-section { + background-color: #1e1e1e; + box-shadow: 0 4px 10px rgba(0,0,0,0.3); +} + +html[data-bs-theme="dark"] .stat-label, +html[data-bs-theme="dark"] .action-desc, +html[data-bs-theme="dark"] .no-appointments-content p { + color: #b0b0b0; +} + +html[data-bs-theme="dark"] .stat-icon-wrapper.blue { background-color: #3a3aff; } +html[data-bs-theme="dark"] .stat-icon-wrapper.green { background-color: #1e7d3a; } +html[data-bs-theme="dark"] .stat-icon-wrapper.purple { background-color: #6c3bbf; } +html[data-bs-theme="dark"] .stat-icon-wrapper.orange { background-color: #b36b1e; } + +html[data-bs-theme="dark"] .action-icon { + color: #a272ff; +} + +html[data-bs-theme="dark"] .no-appointments-icon { + color: #666; +} + +html[data-bs-theme="dark"] .manage-button { + background-color: #3a3aff; + color: #fff; +} + +html[data-bs-theme="dark"] .manage-button:hover { + background-color: #2323b0; } \ No newline at end of file diff --git a/src/pages/style/LandingPage.css b/src/pages/style/LandingPage.css index 078ec5d..fc56b0c 100644 --- a/src/pages/style/LandingPage.css +++ b/src/pages/style/LandingPage.css @@ -102,4 +102,58 @@ .main-action-button:hover { background-color: #4540d6; +} + +html[data-bs-theme="dark"] .landing-page-public-view { + background-color: #181a20; +} + +html[data-bs-theme="dark"] .landing-header { + background-color: #23263a; + box-shadow: 0 1px 5px rgba(0,0,0,0.3); +} + +html[data-bs-theme="dark"] .landing-header .logo h1 { + color: #bfc8ff; +} + +html[data-bs-theme="dark"] .nav-menu a { + color: #bfc8ff; +} + +html[data-bs-theme="dark"] .nav-menu a:hover { + color: #8a7fff; +} + +html[data-bs-theme="dark"] .access-button { + background-color: #8a7fff; + color: #181a20; +} + +html[data-bs-theme="dark"] .nav-menu button:hover { + background-color: #5b56f8; +} + +html[data-bs-theme="dark"] .hero-section { + background: linear-gradient(rgba(24,26,32,0.8), rgba(24,26,32,0.8)), url('https://picsum.photos/1200/600?random=4') center/cover; + color: #e2e6f7; +} + +html[data-bs-theme="dark"] .hero-content .hero-title { + color: #e2e6f7; + text-shadow: 2px 2px 8px rgba(0,0,0,0.8); +} + +html[data-bs-theme="dark"] .hero-content p { + color: #bfc8ff; +} + +html[data-bs-theme="dark"] .main-action-button { + background-color: #8a7fff; + color: #181a20; +} + +html[data-bs-theme="dark"] .main-action-button:hover { + background-color: #5b56f8; + color: #fff; } \ No newline at end of file