Adicionando modo escuro e ajustes de acessibilidade

This commit is contained in:
Eduarda-SS 2025-10-08 19:56:04 -03:00
parent 4cca0a53ea
commit 9bbbded9d6
54 changed files with 2047 additions and 212 deletions

View File

@ -23,5 +23,6 @@
<!-- <script src="%PUBLIC_URL%/vendors/perfect-scrollbar/perfect-scrollbar.min.js"></script>
<script src="%PUBLIC_URL%/js/bootstrap.bundle.min.js"></script>
<script src="%PUBLIC_URL%/js/main.js"></script> -->
<script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script>
</body>
</html>

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -150,7 +150,7 @@ export default function PainelAdministrativo() {
<span
className="department-name"
style={{ flex: 1, fontWeight: "600", color: "#000" }}
style={{ flex: 1, fontWeight: "600" }}
>
{dep.nome}
</span>

View File

@ -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;
}
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;
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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);
}

View File

@ -64,4 +64,36 @@
.icon-mid:before { vertical-align: middle; }
// Z Index
.z-1 { z-index: 1 }
.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;
}
}
}
}

View File

@ -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

View File

@ -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;
}
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}

View File

@ -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
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}
}
}

View File

@ -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;
}
}

View File

@ -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
// }
}

View File

@ -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;
}
}
}
}

View File

@ -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;
}
}

View File

@ -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;
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}

View File

@ -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%
);
}
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}
}

View File

@ -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 {

View File

@ -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;
}
}

View File

@ -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{}
// .glyphs.css-mapping input:hover{}

View File

@ -599,9 +599,6 @@ html[data-bs-theme="dark"] {
}
}
.action-icon,
.action-button,
.form-control {

View File

@ -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;
}

View File

@ -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 @@
}
}
}
}

View File

@ -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;
}

View File

@ -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) {

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}
}

View File

@ -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();

View File

@ -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() {
<div className="row-actions">
<div className="action-btn" onClick={(e)=> toggleDropdown(l.id, e)} title="Ações">
<svg width="16" height="16" viewBox="0 0 24 24"><circle cx="12" cy="5" r="1.6"/><circle cx="12" cy="12" r="1.6"/><circle cx="12" cy="19" r="1.6"/></svg>
<i class="bi bi-three-dots-vertical"></i>
</div>
{openDropdownId === l.id && (

312
src/pages/LaudoStyle.css Normal file
View File

@ -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;
}

View File

@ -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={() => {

View File

@ -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;
}
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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;
}