diff options
author | Ngô Ngọc Đức Huy <huyngo@disroot.org> | 2021-05-30 21:38:58 +0700 |
---|---|---|
committer | Ngô Ngọc Đức Huy <huyngo@disroot.org> | 2021-05-30 21:38:58 +0700 |
commit | 3b687cc3b77e4739ce0ea5c8b0920c82e4c6ab65 (patch) | |
tree | 368cdfffdce6f4ac9e576005e07f9718e97d1de7 /content | |
parent | af57704fcd8aff1f72c09a2dc2d00cef573a7142 (diff) | |
download | blog-3b687cc3b77e4739ce0ea5c8b0920c82e4c6ab65.tar.gz |
Upload new blog post
Diffstat (limited to 'content')
-rw-r--r-- | content/posts/2021-05-30-css-stylus.md | 89 | ||||
-rw-r--r-- | content/posts/badwolf-ish.png | bin | 0 -> 97272 bytes |
2 files changed, 89 insertions, 0 deletions
diff --git a/content/posts/2021-05-30-css-stylus.md b/content/posts/2021-05-30-css-stylus.md new file mode 100644 index 0000000..ba565fc --- /dev/null +++ b/content/posts/2021-05-30-css-stylus.md @@ -0,0 +1,89 @@ +--- +title: "App Recommendation: Stylus" +date: 2021-05-30T21:17:55+07:00 +categories: [blog] +tags: [recommendation, css, custom, stylus, "browser addon"] +draft: true +--- + +# No more theme-switcher + +So, I dropped the theme switcher to `auto` theme, which means it will switch +theme automagically according to your system setting. + +However, if one applies [hardening][ff-config] to Firefox, one will notice that +the feature is broken, and you'll see light theme by default. How would one fix +this? + +I have a nice solution: [Stylus][stylus]. + +Stylus is a browser addon that allows you to write custom CSS. And of course, +it is free software, released under GNU GPL version 3.0! And I love their +privacy policy: + +> Unlike other similar extensions, we don't find you to be all that interesting. +> Your questionable browsing history should remain between you and the NSA. +> Stylus collects nothing. Period. + +# Applying to my website + +I've customized my theme to look a bit like my vim theme, badwolf, but with a +lighter background: + +![badwolf-ish](/posts/badwolf-ish.png) + +Here is the CSS I used: + +```css +:root { + --font-color: #eee; + --bg-color: #212121; + + --link-color: #0a9dff; + --link-state-color:#ffa724; + --link-state-border-color: rgba(238, 54, 54, 0.5); + + --thead-bg-color: #343a40; + --table-border-color: lightgrey; + + --nav-bg-color: #242424; + --nav-link-color: #b6b6b6; + + --pre-color: #333; + --pre-bg-color: #f1f1f1; + + --bq-color: #ccc; + --hr-color: #333; + + --pagination-bg-color: #373737; + --pagination-link-color: #b6b6b6; + + --post-info-color: #599ada; + + --switcher-color: #333; + --switcher-bg-color: #fff; +} + +html { + font-family: monospace; +} + +h1, h2, h3 { + color: #aeee00; +} + +ul li { + list-style: '* '; /* Remove default bullets */ +} + +ul li::marker { + color: #ffa724; + font-weight: bold; +} +``` + +The source file could be found on [sourcehut][sauce] + +[ff-config]: https://privacytools.io/browsers/#about_config +[stylus]: https://addons.mozilla.org/en-US/firefox/addon/styl-us/ +[sauce]: https://git.sr.ht/~huyngo/huyngo.srht.site/tree/master/item/dark.css diff --git a/content/posts/badwolf-ish.png b/content/posts/badwolf-ish.png new file mode 100644 index 0000000..b65afd9 --- /dev/null +++ b/content/posts/badwolf-ish.png Binary files differ |