git/php-llm-agent-www
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG: the navbar works well in light-theme

Browse Source
This commit is contained in:
Frederico @ VilaRosa02 2025-09-17 18:12:28 +00:00
parent 039d586d7b
commit 42206afc88
3 changed files with 24 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@ -1,5 +1,3 @@
<?php // index.php — Simple ChatGPT-like UI in a single PHP file (Bootstrap 5)
require_once __DIR__."/backend.php"; ?>
<!doctype html>
<html lang="en" data-theme="<?= $theme ?>">
<head>
@ -87,7 +85,6 @@ require_once __DIR__."/backend.php"; ?>
</div>
<div class="d-flex gap-2">
<button id="sendBtn" type="submit" class="btn btn-primary">Send</button>
<button id="saveSysBtn" type="button" class="btn btn-outline-secondary">Save System Prompt</button>
</div>
</div>
</form>

24
main.css
View File

@ -128,6 +128,30 @@ html[data-theme="light"] #themeToggle.btn-outline-light:hover {
background-color: var(--muted);
color: #fff;
}
/* --- Light theme: make the navbar truly light --- */
html[data-theme="light"] .navbar {
background-color: #f8f9fa !important; /* light bg (like .bg-light) */
/* override Bootstrap navbar-dark CSS variables to dark text */
--bs-navbar-color: rgba(0,0,0,.65);
--bs-navbar-hover-color: rgba(0,0,0,.85);
--bs-navbar-active-color: rgba(0,0,0,1);
--bs-navbar-brand-color: rgba(0,0,0,.9);
--bs-navbar-toggler-border-color: rgba(0,0,0,.15);
/* dark “hamburger” icon on light bg */
--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,0,0.7)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/* Optional: tighten brand + links for light theme (keeps consistency) */
html[data-theme="light"] .navbar .navbar-brand,
html[data-theme="light"] .navbar .nav-link {
color: var(--bs-navbar-color) !important;
}
html[data-theme="light"] .navbar .nav-link.active,
html[data-theme="light"] .navbar .nav-link:focus,
html[data-theme="light"] .navbar .nav-link:hover {
color: var(--bs-navbar-hover-color) !important;
}
/* --- Dark theme fixes for Bootstrap panels (card + accordion) --- */
html:not([data-theme="light"]) .card,

10
main.js
View File

@ -74,16 +74,6 @@ formEl?.addEventListener('submit', async (e) => {
}
});
// Save system prompt
qs('#saveSysBtn')?.addEventListener('click', async () => {
const message = '';
const system = sysInput ? sysInput.value.trim() : '';
if (!system) return;
// Use a no-op message to persist system prompt? Better: do nothing and let backend save on 'chat'
// Here we just show a toast-like confirmation:
appendAssistantHtml('<em>System prompt saved for next messages.</em>');
});
// Reset chat
resetBtn?.addEventListener('click', async () => {
const res = await post('reset', {});