Skip to content

Instantly share code, notes, and snippets.

@evdama
Last active July 25, 2019 06:10
Show Gist options
  • Select an option

  • Save evdama/43640f5aa92863ff20ff3b1c1ea6bc70 to your computer and use it in GitHub Desktop.

Select an option

Save evdama/43640f5aa92863ff20ff3b1c1ea6bc70 to your computer and use it in GitHub Desktop.
how to best toggle the data-theme attributes value between 'light' and 'dark'?
<!DOCTYPE html>
<html id="edm-html-root" lang="en" class="min-h-full text-one antialiased font-family-one text-sm md:text-base bg-one" data-theme="light">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1.0'>
<meta name="theme-color" content="#ffffff">
%sapper.base%
<!-- TODO: remove once certain our PWA works fine eg shows favicon & homescreen icons just fine -->
<!--
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#2d89ef">
-->
<link href="https://fonts.googleapis.com/css?family=Montserrat:200,400,700,900|Roboto:200,400,700,900&display=swap"
rel="stylesheet">
<!-- <link rel='stylesheet' href='main.css'> -->
<link rel='stylesheet' href='global.css'>
<link rel='manifest' href='manifest.json'>
<link rel='icon' type='image/x-icon' href='favicon.ico'>
<!-- Sapper generates a <style> tag containing critical CSS
for the current page. CSS for the rest of the app is
lazily loaded when it precaches secondary pages -->
%sapper.styles%
<!-- This contains the contents of the <svelte:head> component, if
the current page has one -->
%sapper.head%
</head>
<body>
<!-- The application will be rendered inside this element,
because `app/client.js` references it -->
<div class="container mt-2 md:mt-4">
<div id='sapper' class="min-h-screen flex flex-col">%sapper.html%</div>
</div>
<!-- Sapper creates a <script> tag containing `app/client.js`
and anything else it needs to hydrate the app and
initialize the router -->
%sapper.scripts%
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment