Adicionando modo escuro e ajustes de acessibilidade
This commit is contained in:
parent
4cca0a53ea
commit
9bbbded9d6
@ -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>
|
||||
|
||||
@ -36,3 +36,12 @@
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
html[data-bs-theme="dark"] .App-header {
|
||||
background-color: #121212;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
|
||||
html[data-bs-theme="dark"] .App-link {
|
||||
color: #bb86fc;
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -212,3 +212,56 @@
|
||||
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;
|
||||
}
|
||||
@ -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>
|
||||
|
||||
@ -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;
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -187,3 +187,85 @@ 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);
|
||||
}
|
||||
@ -65,3 +65,35 @@
|
||||
|
||||
// Z Index
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -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
|
||||
|
||||
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
@ -90,3 +90,27 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
@ -8,3 +8,11 @@
|
||||
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
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,3 +4,14 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
|
||||
// &-actions {
|
||||
// // Optional: adjust button/link color if needed
|
||||
// }
|
||||
}
|
||||
@ -35,3 +35,15 @@
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-bs-theme="dark"] {
|
||||
.divider {
|
||||
.divider-text {
|
||||
background-color: #232323 !important;
|
||||
color: #e0e0e0 !important;
|
||||
&:before, &:after {
|
||||
border-top-color: #333 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -24,3 +24,17 @@
|
||||
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;
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
|
||||
@ -46,3 +46,24 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -44,3 +44,11 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-bs-theme="dark"] {
|
||||
.modal-content {
|
||||
background-color: #232323 !important;
|
||||
color: #e0e0e0 !important;
|
||||
border-color: #333 !important;
|
||||
}
|
||||
}
|
||||
@ -299,3 +299,14 @@
|
||||
#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;
|
||||
}
|
||||
}
|
||||
@ -30,3 +30,32 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -37,3 +37,15 @@
|
||||
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;
|
||||
}
|
||||
}
|
||||
@ -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%
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -30,3 +30,19 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -217,3 +217,51 @@
|
||||
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;
|
||||
}
|
||||
}
|
||||
@ -65,3 +65,41 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -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 {
|
||||
|
||||
@ -16,3 +16,45 @@ 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;
|
||||
}
|
||||
}
|
||||
@ -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{}
|
||||
@ -599,9 +599,6 @@ html[data-bs-theme="dark"] {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.action-icon,
|
||||
.action-button,
|
||||
.form-control {
|
||||
|
||||
@ -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;
|
||||
}
|
||||
|
||||
|
||||
@ -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 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -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 {
|
||||
@ -40,3 +40,18 @@
|
||||
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;
|
||||
}
|
||||
@ -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) {
|
||||
|
||||
@ -15,7 +15,6 @@
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
.icons-div{
|
||||
border: 1px solid #607080;
|
||||
padding: 10px;
|
||||
@ -221,3 +220,87 @@ select[name=solicitante]{
|
||||
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;
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -106,9 +106,6 @@
|
||||
border-left: 5px solid transparent; /* espaço da borda colorida */
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.usuario-azul {
|
||||
background-color: #E3F2FD;
|
||||
border-left: 4px solid #2196F3;
|
||||
@ -154,3 +151,72 @@
|
||||
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;
|
||||
}
|
||||
@ -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;
|
||||
@ -72,3 +71,43 @@
|
||||
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;
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
@ -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();
|
||||
|
||||
@ -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
312
src/pages/LaudoStyle.css
Normal 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;
|
||||
}
|
||||
@ -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={() => {
|
||||
|
||||
|
||||
@ -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;
|
||||
@ -145,17 +135,13 @@
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -276,3 +276,94 @@ textarea {
|
||||
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;
|
||||
}
|
||||
@ -180,3 +180,52 @@
|
||||
.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;
|
||||
}
|
||||
@ -103,3 +103,57 @@
|
||||
.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;
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user