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

UI/UX: unificação das cores e estilos dos botões das ferramentas para combinar com suas identidades visuais

Browse Source
This commit is contained in:
admtracksteel
2026-06-05 18:22:09 +00:00
parent a2318fc0b4
commit 6e16a16867
2 changed files with 56 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+3 -3
View File
@@ -789,7 +789,7 @@
<input type="text" id="musicaTemaInput" placeholder="Ex: amizade na escola, lavar as mãos, alfabeto..." class="obs-input" style="width: 100%; margin-top: 4px; padding: 10px;">
</div>
<button type="button" id="btnGenerateMusica" class="btn-login" style="margin-top: 10px; padding: 14px; font-size: 1rem;">🎵 Compor Música</button>
<button type="button" id="btnGenerateMusica" style="width: 100%; padding: 12px; background: #a855f7; color: white; border: none; border-radius: 10px; font-weight: 700; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 12px rgba(168, 85, 247, 0.3); transition: all 0.2s;">🎵 Compor Música Pedagógica</button>
<div id="musicaGenerateLoader" style="display: none; align-items: center; justify-content: center; gap: 10px; margin-top: 15px;">
<div class="spinner"></div>
@@ -875,7 +875,7 @@
<input type="text" id="historiaTemaInput" placeholder="Ex: Uma fada que não sabia voar, a importância de dividir..." class="obs-input" style="width: 100%; margin-top: 4px; padding: 10px;">
</div>
<button type="button" id="btnGenerateHistoria" class="btn-login" style="margin-top: 10px; padding: 14px; font-size: 1rem;">✍️ Inventar História</button>
<button type="button" id="btnGenerateHistoria" style="width: 100%; padding: 12px; background: #10a37f; color: white; border: none; border-radius: 10px; font-weight: 700; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 12px rgba(16, 163, 127, 0.3); transition: all 0.2s;">✍️ Inventar História</button>
<div id="historiaGenerateLoader" style="display: none; align-items: center; justify-content: center; gap: 10px; margin-top: 15px;">
<div class="spinner"></div>
@@ -944,7 +944,7 @@
</div>
<div style="display: flex; flex-direction: column; gap: 10px; margin-top: 8px;">
<button id="btnGeneratePoesia" style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: white; border: none; padding: 12px; border-radius: 8px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; transition: opacity 0.2s; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);">
<button id="btnGeneratePoesia" style="width: 100%; padding: 12px; background: #eab308; color: #1e293b; border: none; border-radius: 10px; font-weight: 700; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 12px rgba(234, 179, 8, 0.3); transition: all 0.2s;">
<span>📜 Criar Poesia Personalizada</span>
</button>
<div id="poesiaGenerateLoader" style="display: none; align-items: center; justify-content: center; gap: 10px; color: var(--text-secondary); font-size: 0.9rem; padding: 10px; background: rgba(255, 255, 255, 0.02); border-radius: 8px;">