Add tab icons, fix mobile nav overflow, and soften card styling

This commit is contained in:
Nate committed 2026-03-16 14:15:10 -04:00
1 parent 11f2769d7f
commit 9bf83d44aa
2 files changed
+78 -30

No files matched your search

+20 -5
View File
@@ -23,11 +23,26 @@
<header class="masthead">
<h1>Weather</h1>
<nav class="tabs">
<button class="tab active" data-tab="conditions">Conditions</button>
<button class="tab" data-tab="radar-full">Radar</button>
<button class="tab" data-tab="maps">Maps</button>
<button class="tab" data-tab="alerts">Alerts</button>
<button class="tab" data-tab="settings">Settings</button>
<button class="tab active" data-tab="conditions" aria-label="Conditions">
<span class="tab-icon" aria-hidden="true">☀</span>
<span class="tab-text">Now</span>
</button>
<button class="tab" data-tab="radar-full" aria-label="Radar">
<span class="tab-icon" aria-hidden="true">◉</span>
<span class="tab-text">Radar</span>
</button>
<button class="tab" data-tab="maps" aria-label="Maps">
<span class="tab-icon" aria-hidden="true">⌘</span>
<span class="tab-text">Maps</span>
</button>
<button class="tab" data-tab="alerts" aria-label="Alerts">
<span class="tab-icon" aria-hidden="true">⚠</span>
<span class="tab-text">Alerts</span>
</button>
<button class="tab" data-tab="settings" aria-label="Settings">
<span class="tab-icon" aria-hidden="true">⚙</span>
<span class="tab-text">Settings</span>
</button>
</nav>
<span class="tagline">Open-Meteo · RainViewer</span>
</header>