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

feat: adiciona gerenciador dinamico de personagens para a Fabrica de Quadrinhos com nomes e tipos customizados

Browse Source
This commit is contained in:
admtracksteel
2026-06-03 12:27:33 +00:00
parent bb64a389e4
commit 239eb22730
2 changed files with 78 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+11 -6
View File
@@ -786,12 +786,17 @@
<!-- PERSONAGENS -->
<div class="settings-group">
<label style="color: var(--text-secondary); font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;">5. Personagens Principais</label>
<div style="display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px;">
<button type="button" class="btn-music-option btn-comics-char active" data-char="lucas" style="flex: 1; min-width: 120px;">🧒 Lucas (Criança)</button>
<button type="button" class="btn-music-option btn-comics-char" data-char="mariana" style="flex: 1; min-width: 120px;">👧 Mariana (Criança)</button>
<button type="button" class="btn-music-option btn-comics-char" data-char="animais" style="flex: 1; min-width: 120px;">🐾 Animais da Floresta</button>
<button type="button" class="btn-music-option btn-comics-char" data-char="professor" style="flex: 1; min-width: 120px;">👩‍🏫 Professora Camila</button>
<label style="color: var(--text-secondary); font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; display: flex; justify-content: space-between; align-items: center;">
<span>5. Personagens da História</span>
<div style="display: flex; gap: 8px;">
<button type="button" id="btnAddHumanChar" class="btn-music-option" style="padding: 3px 8px; font-size: 0.72rem; border-color: var(--brand-pink); color: var(--brand-pink); background: rgba(219, 39, 119, 0.05); margin: 0;">+ 🧒 Humano</button>
<button type="button" id="btnAddAnimalChar" class="btn-music-option" style="padding: 3px 8px; font-size: 0.72rem; border-color: var(--brand-pink); color: var(--brand-pink); background: rgba(219, 39, 119, 0.05); margin: 0;">+ 🐾 Animal</button>
</div>
</label>
<!-- Lista Dinâmica de Personagens -->
<div id="comicsCharListContainer" style="display: flex; flex-direction: column; gap: 8px; margin-top: 6px;">
<!-- Itens adicionados dinamicamente por JavaScript -->
</div>
</div>