Skip to content

Instantly share code, notes, and snippets.

@kohrongying
Created June 21, 2022 16:07
Show Gist options
  • Select an option

  • Save kohrongying/271648f64da3a11407a4f62bcc0e6984 to your computer and use it in GitHub Desktop.

Select an option

Save kohrongying/271648f64da3a11407a4f62bcc0e6984 to your computer and use it in GitHub Desktop.
tailwind base config
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name='viewport' content='width=device-width'>
<title>{{ site.title }}</title>
<meta name='description' content="{{ site.description }}">
<meta name="author" content="{{ site.author }}">
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ site.title }}" />
<meta property="og:description" content="{{ site.description }}" />
<meta property="og:image" content="/assets/img/turtwork-600.png" />
<meta property="og:url" content={{ site.url }} />
<meta property="og:site_name" content="{{ site.title }}" />
<meta name="theme-color" content="#ffffff"/>
<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/favicon-32x32.png">
<link rel="apple-touch-icon" href="/assets/img/favicon/apple-touch-icon.png">
<link rel="manifest" href="/manifest.json" />
<link href="https://unpkg.com/prismjs@1.23.0/themes/prism-okaidia.css" rel="stylesheet">
<link href="/assets/styles/tailwind.css" rel="stylesheet" />
<link href="/assets/styles/index.css" rel="stylesheet" />
<script>
const isDarkMode = () => localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches);
if (isDarkMode()) {
document.documentElement.classList.add('dark')
} else {
document.documentElement.classList.remove('dark')
}
</script>
</head>
<body class="dark:text-white dark:bg-black">
<div class="min-h-screen flex flex-col">
<main class="flex-1 w-10/12 max-w-screen-sm md:max-w-screen-md mx-auto">
</main>
</div>
<script>
document.getElementById("toggleDarkMode").addEventListener("click", function() {
if (isDarkMode()) {
localStorage.theme = 'light'
document.documentElement.classList.remove('dark')
} else {
localStorage.theme = 'dark'
document.documentElement.classList.add('dark')
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment