jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-03 17:26:37 -04:00
Code Issues Activity

disable typographer (fancy quotes, etc.)

Browse Source
This commit is contained in:
Jake Jarvis
2021-04-28 18:40:21 -04:00
parent 33d78679ba
commit 5a53aab5d3
7 changed files with 38 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
content/daily.pdf Normal file
View File

Binary file not shown.

26
content/humans.txt
View File

@ -51,28 +51,8 @@
All content is licensed under CC-BY-4.0, an
open & permissive Creative Commons license:
https://jarv.is/license/
https://jarv.is/license/
Twemoji: Licensed under Creative Commons
Attribution 4.0 International by Twitter, Inc.
and other contributors:
Third-party dependencies and their licenses:
https://twemoji.twitter.com/
Inter: Copyright (c) 2016-2020 The Inter
Project Authors. Licensed under the SIL Open
Font License, Version 1.1:
https://rsms.me/inter/
Roboto Mono: Copyright (c) 2015 The Roboto Mono
Project Authors. Licensed under the the Apache
License, Version 2.0.
https://fonts.google.com/specimen/Roboto+Mono
Comic Neue: Copyright (c) 2014 The Comic Neue
Project Authors. Licensed under the SIL Open
Font License, Version 1.1:
http://comicneue.com/
https://github.com/jakejarvis/jarv.is/blob/main/README.md#licenses

4
content/notes/dark-mode/index.md
View File

@ -28,7 +28,7 @@ It _is_ possible to use [pure CSS3 media queries to do this](https://css-tricks.
I've written a simple implementation below, which...
- Defaults to a user's system preference, until they press your toggle to set it themselves
- Listens for clicks on any element of your choosing --- just set the class to `dark-mode-toggle`. For example:
- Listens for clicks on any element of your choosing — just set the class to `dark-mode-toggle`. For example:
```html {linenos=false}
<button class="dark-mode-toggle">💡 Switch Themes</button>
@ -37,7 +37,7 @@ I've written a simple implementation below, which...
- Remembers the visitor's preference between visits using the [local storage](https://www.w3schools.com/html/html5_webstorage.asp) of the their browser (not cookies, please don't use cookies!)
- Switches your `<body>`'s class between `light` and `dark`...
...meaning that any CSS selectors beginning with `body.dark` or `body.light` will only apply when the respective mode is active. A good place to start is by separating any color rules --- your background, text, links, etc. --- into a different section of your CSS. Using [SASS or SCSS](https://sass-lang.com/) makes this a whole lot [easier with nesting](https://sass-lang.com/guide#topic-3) but is not required; this was written with a [KISS](https://getyarn.io/yarn-clip/embed/eed08f4f-d1c9-4cc0-b041-f280a5dbf0a5?autoplay=false) mentality.
...meaning that any CSS selectors beginning with `body.dark` or `body.light` will only apply when the respective mode is active. A good place to start is by separating any color rules — your background, text, links, etc. — into a different section of your CSS. Using [SASS or SCSS](https://sass-lang.com/) makes this a whole lot [easier with nesting](https://sass-lang.com/guide#topic-3) but is not required; this was written with a [KISS](https://getyarn.io/yarn-clip/embed/eed08f4f-d1c9-4cc0-b041-f280a5dbf0a5?autoplay=false) mentality.
{{< iframe src="/notes/dark-mode/example.html" width="650" height="275" title="Dark Mode Example" sandbox="allow-same-origin allow-scripts allow-popups" >}}