feat: Add SkyView logo, favicon, and branding assets - resolves #38

Created comprehensive branding package for SkyView including:

Assets Created:
- SVG logo with animated radar theme for header
- Multi-size favicon set (16px, 32px, 48px)
- High-resolution app icon (512x512) for mobile/desktop
- Aviation-themed radar design with animated aircraft blips

UI Updates:
- Updated HTML with proper favicon links and theme color
- Enhanced header layout to include logo alongside version info
- Added responsive CSS styling for new branding elements
- Logo features animated radar sweep and aircraft tracking theme

Technical Details:
- All assets use SVG format for scalability and crisp display
- Radar theme with cyan/blue color scheme matching app design
- Logo includes animated elements (radar sweep, blinking aircraft)
- Favicons optimized for different display sizes
- Added proper meta tags for mobile app integration

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ole-Morten Duesund 2025-09-01 17:39:42 +02:00
commit 49f584016e
8 changed files with 319 additions and 5 deletions

View file

@ -4,7 +4,14 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SkyView - Multi-Source ADS-B Aircraft Tracker</title>
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<!-- Favicon and app icons -->
<link rel="icon" type="image/svg+xml" href="/static/images/favicon-16.svg" sizes="16x16">
<link rel="icon" type="image/svg+xml" href="/static/images/favicon-32.svg" sizes="32x32">
<link rel="icon" type="image/svg+xml" href="/static/images/favicon-48.svg" sizes="48x48">
<link rel="icon" type="image/svg+xml" href="/static/images/skyview-favicon.svg">
<link rel="apple-touch-icon" href="/static/images/skyview-app-icon.svg" sizes="512x512">
<meta name="theme-color" content="#003d52">
<!-- Leaflet CSS -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
@ -28,10 +35,16 @@
<body>
<div id="app">
<header class="header">
<h1>SkyView <span class="version-info">v0.0.11</span>
<a href="https://kode.naiv.no/olemd/skyview" target="_blank" class="repo-link" title="Project Repository"></a>
<a href="/database" class="repo-link" title="Database Status">📊</a>
</h1>
<div class="header-brand">
<img src="/static/images/skyview-logo.svg" alt="SkyView Logo" class="header-logo">
<div class="header-text">
<span class="version-info">v0.0.11</span>
<div class="header-links">
<a href="https://kode.naiv.no/olemd/skyview" target="_blank" class="repo-link" title="Project Repository"></a>
<a href="/database" class="repo-link" title="Database Status">📊</a>
</div>
</div>
</div>
<!-- Status indicators -->
<div class="status-section">