index.html raw
1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8" />
5 <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
6
7 <title>Smesh</title>
8 <meta name="description" content="A user-friendly Nostr client for exploring relay feeds" />
9 <meta
10 name="keywords"
11 content="smesh, nostr, web, client, relay, feed, social, pwa, simple, clean"
12 />
13
14 <meta name="apple-mobile-web-app-title" content="Smesh" />
15 <link rel="preconnect" href="https://fonts.googleapis.com" />
16 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
17 <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet" />
18 <link rel="icon" href="/favicon.ico" sizes="48x48" />
19 <link rel="icon" href="/favicon.png" sizes="256x256" type="image/png" />
20 <meta name="theme-color" content="#171717" media="(prefers-color-scheme: dark)" />
21 <meta name="theme-color" content="#FFFFFF" media="(prefers-color-scheme: light)" />
22
23 <meta property="og:url" content="https://smesh.mleku.dev" />
24 <meta property="og:type" content="website" />
25 <meta property="og:title" content="Smesh" />
26 <meta
27 property="og:description"
28 content="A user-friendly Nostr client for exploring relay feeds"
29 />
30 <meta
31 property="og:image"
32 content="https://git.mleku.dev/mleku/smesh/raw/branch/master/resources/og-image.png"
33 />
34
35 <style>
36 /* Prevent flash - set background based on system preference before CSS loads */
37 html, body, #root { background-color: #FFFFFF; color: #171717; }
38 @media (prefers-color-scheme: dark) {
39 html, body, #root { background-color: #171717; color: #FAFAFA; }
40 }
41 html.light, html.light body, html.light #root { background-color: #FFFFFF !important; color: #171717 !important; }
42 html.dark, html.dark body, html.dark #root { background-color: #171717 !important; color: #FAFAFA !important; }
43 html.dark.pure-black, html.dark.pure-black body, html.dark.pure-black #root { background-color: #000000 !important; }
44 </style>
45 <script>
46 (function() {
47 var theme = localStorage.getItem('theme-setting');
48 if (theme === 'light') {
49 document.documentElement.classList.add('light');
50 } else if (theme === 'dark' || theme === 'pure-black') {
51 document.documentElement.classList.add('dark', 'pure-black');
52 } else {
53 // No saved preference — follow system/browser theme
54 if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
55 document.documentElement.classList.add('dark', 'pure-black');
56 } else {
57 document.documentElement.classList.add('light');
58 }
59 }
60 })();
61 </script>
62 </head>
63 <body>
64 <div id="root"></div>
65 <script type="module" src="/src/main.tsx"></script>
66 </body>
67 </html>
68