adding a few meta tags, script for getting system preference for dark mode

This commit is contained in:
Brian 2022-07-19 13:35:22 -06:00
parent dcc1318a84
commit 3adc226ad5
Signed by: brian
GPG Key ID: DE1A5390A3B84CD8

View File

@ -6,6 +6,9 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Set the base URL for all relative URLs within the document -->
<base href="https://example.com/">
<meta name="robots" content="index,follow"> <meta name="robots" content="index,follow">
<meta name="googlebot" content="index,follow"> <meta name="googlebot" content="index,follow">
@ -25,6 +28,7 @@
<!-- Privacy --> <!-- Privacy -->
<meta name="twitter:dnt" content="on"> <meta name="twitter:dnt" content="on">
<meta name="pinterest" content="nopin" description="No pinning allowed.">
<!-- analytics --> <!-- analytics -->
<!-- --> <!-- -->
@ -62,14 +66,21 @@
<link href="https://example.com/css/print.css" rel="stylesheet" media="print"> <link href="https://example.com/css/print.css" rel="stylesheet" media="print">
<!-- JS that must be executed before the document is loaded --> <!-- JS that must be executed before the document is loaded -->
<script>
if (localStorage.theme === "dark" || (!("theme" in localStorage) && window.matchMedia("(prefers-color-scheme: dark)").matches)) {
document.documentElement.classList.add("dark"); localStorage.theme = "dark";
} else {
document.documentElement.classList.remove("dark"); localStorage.theme = "light";
}
</script>
<script src="https://example.com/js/vendor/axios.min.js" defer></script> <script src="https://example.com/js/vendor/axios.min.js" defer></script>
<script src="https://example.com/js/vendor/vue.min.js" defer></script> <script src="https://example.com/js/vendor/vue.min.js" defer></script>
<script src="https://example.com/js/app.js" defer></script> <script src="https://example.com/js/app.js" defer></script>
<!-- -->
</head> </head>
<body class="font-sans antialiased"> <body class="font-sans antialiased">
<div id="app" class="min-h-screen bg-neutral-100"> <div id="app" class="min-h-screen bg-neutral-100">
<!-- --> <!-- content here -->
</div> </div>
</body> </body>
</html> </html>