🔴 Alta priority: tema claro/escuro, modal tags, favicon K, badge modelo dinâmico

This commit is contained in:
2026-05-26 15:39:37 +00:00
parent 36ea7cce7a
commit f42bb49360
5 changed files with 629 additions and 16 deletions
+35 -2
View File
@@ -11,7 +11,8 @@
<!-- Highlight.js para destaque de sintaxe em códigos -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css">
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="https://chatgpt.com/favicon.ico" type="image/x-icon">
<!-- Favicon customizado K (Kemily/Camila) -->
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='6' fill='%2310a37f'/><text x='16' y='22' font-family='Arial' font-size='18' font-weight='bold' fill='white' text-anchor='middle'>K</text></svg>" type="image/svg+xml">
</head>
<body>
<div class="app-container">
@@ -101,12 +102,25 @@
</button>
<div class="model-badge">
<span>GPT-4.1 Nano</span>
<span id="modelBadgeText">GPT-4.1 Nano</span>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="chevron">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</div>
<div class="header-right">
<button class="btn-theme-toggle" id="btnThemeToggle" title="Alternar tema" aria-label="Alternar entre tema claro e escuro">
<!-- Sun icon (shown in dark mode, to switch to light) -->
<svg id="iconThemeSun" 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 3v2.25m6.364.386-1.591 1.591M21 12h-2.25m-.386 6.364-1.591-1.591M12 18.75V21m-4.773-4.227-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M12 6.75a3.75 3.75 0 1 0 0 7.5 3.75 3.75 0 0 0 0-7.5Z" />
</svg>
<!-- Moon icon (shown in light mode, to switch to dark) -->
<svg id="iconThemeMoon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" style="display:none">
<path stroke-linecap="round" stroke-linejoin="round" d="M21.752 15.002A9.72 9.72 0 0 1 18 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 0 0 3 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 0 0 9.002-5.998Z" />
</svg>
</button>
</div>
<button class="btn-new-chat-mobile" id="btnNewChatMobile" aria-label="Novo chat">
<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 4.5v15m7.5-7.5h-15" />
@@ -159,6 +173,25 @@
<p class="disclaimer">Camila AI pode cometer erros. Considere verificar informações importantes.</p>
</div>
</footer>
<!-- Modal de Tags -->
<div class="modal-overlay" id="modalTagOverlay">
<div class="modal-tag">
<div class="modal-tag-header">
<span class="modal-tag-title">Selecionar tags</span>
<button class="modal-tag-close" id="modalTagClose" aria-label="Fechar">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" width="20" height="20">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="modal-tag-list" id="modalTagList"></div>
<div class="modal-tag-actions">
<button class="modal-tag-btn secondary" id="modalTagCancel">Cancelar</button>
<button class="modal-tag-btn primary" id="modalTagConfirm">Confirmar</button>
</div>
</div>
</div>
</main>
</div>