Geert Rademakes ba78aabd53 feat: Add proper title and favicon for Rekordbox Reader
- Update page title to 'Rekordbox Reader - Music Library Manager'
- Create custom music-themed favicon with blue color scheme
- Add comprehensive meta tags for SEO and social sharing
- Include Open Graph and Twitter Card meta tags
- Create web app manifest for PWA support
- Add theme color and app branding
- Improve browser tab and bookmark appearance
- Add keywords and author meta tags for better discoverability

The web app now has professional branding with a custom favicon
and proper meta tags for better user experience and SEO.
2025-08-06 16:02:00 +02:00

42 lines
1.8 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Rekordbox Reader - Music Library Manager</title>
<meta name="description" content="Manage your Rekordbox music library with S3 storage integration and web-based playback" />
<meta name="keywords" content="rekordbox, music, library, manager, s3, storage, dj, playlist" />
<meta name="author" content="Rekordbox Reader" />
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:title" content="Rekordbox Reader - Music Library Manager" />
<meta property="og:description" content="Manage your Rekordbox music library with S3 storage integration and web-based playback" />
<meta property="og:image" content="/favicon.svg" />
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content="Rekordbox Reader - Music Library Manager" />
<meta property="twitter:description" content="Manage your Rekordbox music library with S3 storage integration and web-based playback" />
<meta property="twitter:image" content="/favicon.svg" />
<!-- App manifest -->
<link rel="manifest" href="/manifest.json" />
<meta name="theme-color" content="#1a202c" />
<script>
// Insert this script in your index.html right after the <body> tag.
// This will help to prevent a flash if dark mode is the default.
(function() {
document.documentElement.style.backgroundColor = '#171923';
document.body.style.backgroundColor = '#171923';
})();
</script>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>