Add brand icon to header

This commit is contained in:
chris 2025-12-09 09:50:06 -05:00
parent a9df18ed55
commit af96323e0c

View File

@ -93,6 +93,12 @@
}
h1 { margin: 0; font-size: 1.3rem; font-weight: 800; letter-spacing: 0.5px; color: var(--header-text); text-shadow: 1px 1px 2px rgba(0,0,0,0.1); font-family: 'Cormorant Garamond', Georgia, serif; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand-icon {
width: 32px; height: 32px; border-radius: 10px;
background: rgba(255,255,255,0.15); padding: 6px;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);
}
.header-controls { display: flex; gap: 10px; }
@ -291,7 +297,10 @@
<body>
<header>
<h1>Toadstool Tally</h1>
<div class="brand">
<img class="brand-icon" src="assets/icons/favicon.svg" alt="Toadstool Tally icon">
<h1>Toadstool Tally</h1>
</div>
<div class="header-controls">
<button class="header-btn" id="themeBtn" onclick="toggleTheme()" title="Toggle Dark Mode">🌓</button>
<button class="header-btn" id="focusBtn" onclick="toggleFocusMode()" title="Focus Mode (Keeps Screen On)">👁️</button>