admtracksteel/camila
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Padroniza textos e ícones com cores sólidas nos botões da interface

Browse Source
This commit is contained in:
admtracksteel
2026-06-07 15:38:12 +00:00
parent 49f624062b
commit 2e462cf310
2 changed files with 21 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+2 -2
View File
@@ -76,7 +76,7 @@
<!-- Seção: Observações --> <!-- Seção: Observações -->
<div class="sidebar-actions-obs" style="display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 4px 16px;"> <div class="sidebar-actions-obs" style="display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 4px 16px;">
<!-- Botão: Minhas Observações --> <!-- Botão: Minhas Observações -->
<button class="btn-observacoes" id="btnObservacoes"> <button class="btn-observacoes" id="btnObservacoes" style="border-color: #f43f5e; color: #f43f5e; background: rgba(244, 63, 94, 0.05);">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25" /> <path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25" />
</svg> </svg>
@@ -118,7 +118,7 @@
</button> </button>
<!-- Botão: Modelos de Relatório --> <!-- Botão: Modelos de Relatório -->
<button class="btn-observacoes" id="btnModelosRelatorio"> <button class="btn-observacoes" id="btnModelosRelatorio" style="border-color: #14b8a6; color: #14b8a6; background: rgba(20, 184, 166, 0.05);">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
public/style.css
+19 -11
View File
@@ -2249,41 +2249,49 @@ code {
/* Modo Música: Estilos e Cores (Roxo/Violeta) */ /* Modo Música: Estilos e Cores (Roxo/Violeta) */
.btn-prompt-mode.mode-music { .btn-prompt-mode.mode-music {
border-color: rgba(168, 85, 247, 0.3); border-color: rgba(168, 85, 247, 0.4);
color: #c084fc;
background-color: rgba(168, 85, 247, 0.05);
} }
.btn-prompt-mode.mode-music:hover { .btn-prompt-mode.mode-music:hover {
border-color: rgb(168, 85, 247); border-color: rgb(168, 85, 247);
background-color: rgba(168, 85, 247, 0.06); background-color: rgba(168, 85, 247, 0.1);
color: rgb(216, 180, 254); color: #d8b4fe;
} }
/* Modo Vídeo: Estilos e Cores (Azul/Ciano) */ /* Modo Vídeo: Estilos e Cores (Azul/Ciano) */
.btn-prompt-mode.mode-video { .btn-prompt-mode.mode-video {
border-color: rgba(6, 182, 212, 0.3); border-color: rgba(6, 182, 212, 0.4);
color: #22d3ee;
background-color: rgba(6, 182, 212, 0.05);
} }
.btn-prompt-mode.mode-video:hover { .btn-prompt-mode.mode-video:hover {
border-color: rgb(6, 182, 212); border-color: rgb(6, 182, 212);
background-color: rgba(6, 182, 212, 0.06); background-color: rgba(6, 182, 212, 0.1);
color: rgb(165, 243, 252); color: #67e8f9;
} }
/* Modo Imagem: Estilos e Cores (Laranja/Rosa) */ /* Modo Imagem: Estilos e Cores (Laranja/Rosa) */
.btn-prompt-mode.mode-image { .btn-prompt-mode.mode-image {
border-color: rgba(249, 115, 22, 0.3); border-color: rgba(249, 115, 22, 0.4);
color: #fb923c;
background-color: rgba(249, 115, 22, 0.05);
} }
.btn-prompt-mode.mode-image:hover { .btn-prompt-mode.mode-image:hover {
border-color: rgb(249, 115, 22); border-color: rgb(249, 115, 22);
background-color: rgba(249, 115, 22, 0.06); background-color: rgba(249, 115, 22, 0.1);
color: rgb(253, 186, 116); color: #fdba74;
} }
/* Modo Texto/História: Estilos e Cores (Verde Kemily) */ /* Modo Texto/História: Estilos e Cores (Verde Kemily) */
.btn-prompt-mode.mode-text { .btn-prompt-mode.mode-text {
border-color: rgba(16, 163, 127, 0.3); border-color: rgba(16, 163, 127, 0.4);
color: #34d399;
background-color: rgba(16, 163, 127, 0.05);
} }
.btn-prompt-mode.mode-text:hover { .btn-prompt-mode.mode-text:hover {
border-color: var(--brand-green); border-color: var(--brand-green);
background-color: rgba(16, 163, 127, 0.06); background-color: rgba(16, 163, 127, 0.1);
color: rgb(167, 243, 208); color: rgb(167, 243, 208);
} }