diff --git a/new-site/content/updates/updated-the-css-again.md b/new-site/content/updates/updated-the-css-again.md new file mode 100644 index 00000000..e6171753 --- /dev/null +++ b/new-site/content/updates/updated-the-css-again.md @@ -0,0 +1,33 @@ +--- +title: "Updated the Css Again (prefers-color-scheme)" +date: 2023-04-05T16:58:44+03:00 +draft: false +tags: ['updates'] +--- + +I actually updated the css once more. + +If you're using a dark theme in your browser, the website will follow suit and change to darker colors. + +I did this by setting the light theme to be by default for more readability: + +```css +:root { + --bg: #fafafa; + --fg: #2f343f; + --links: #4084d6; + --muted_text: rgb(93, 93, 99); +} +``` +and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn't know this stuff existed, thought webshits just use java script for everything, but I guess I'm wrong. + +```css +@media (prefers-color-scheme: dark) { + :root { + --bg: #141414; + --fg: rgb(232, 228, 228); + --links: #5da0f2; + --muted_text: rgb(179, 182, 186); + } +} +``` diff --git a/new-site/public/blog/index.xml b/new-site/public/blog/index.xml index 7b595064..71754a9f 100644 --- a/new-site/public/blog/index.xml +++ b/new-site/public/blog/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/categories/index.xml b/new-site/public/categories/index.xml index 494182e6..0c67fa12 100644 --- a/new-site/public/categories/index.xml +++ b/new-site/public/categories/index.xml @@ -9,6 +9,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/index.html b/new-site/public/index.html index 47587788..3d2e8dbd 100644 --- a/new-site/public/index.html +++ b/new-site/public/index.html @@ -29,6 +29,9 @@

Recent posts: #

    +
  • Updated the Css Again (prefers-color-scheme) - I actually updated the css once more. +If you’re using a dark theme in your browser, the website will follow suit and change to darker colors. +I … Read more (1 minutes read).
  • Ship of Fools - Once upon a time, the captain and the mates of a ship grew so vain of their seamanship, so full of hubris and so impressed with themselves, that they … Read more (11 minutes read).
  • The Long Term Outcome of Geo Engineering - In 2009, a correspondent asked me whether I thought nuclear weapons were the most dangerous aspect of modern technology. What follows is my reply, … Read more (4 minutes read).
  • Ecofascism an Aberrant Branch of Leftism - The “ecofascists,” as I understand that term, share, at a minimum, two traits: @@ -42,7 +45,6 @@ A great revolution is brewing. What this means is that the necessary preconditio
  • Industrial Society and Its Future - Introduction # The Industrial Revolution and its consequences have been a disaster for the human race. They have greatly increased the life expectancy … Read more (159 minutes read).
  • Recover Lost Anki Streak - How to recover a lost anki streak # Word for word copy paste of what fixed my issue. Original post btw i had to create a seperate Custom Study for … Read more (1 minutes read).
  • -
  • Meta Description in Hugo - Adding meta description in Hugo # I assume you are using Luke Smith’s theme - Lugo, if you are not, you’d have to find these files … Read more (1 minutes read).
diff --git a/new-site/public/index.xml b/new-site/public/index.xml index 2b3cd531..b79c1759 100644 --- a/new-site/public/index.xml +++ b/new-site/public/index.xml @@ -5,11 +5,38 @@ Recent content on vodoraslo Hugo -- gohugo.io en-us - Sat, 01 Apr 2023 14:48:01 +0300 + Wed, 05 Apr 2023 16:58:44 +0300 + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/library/hackbook/index.xml b/new-site/public/library/hackbook/index.xml index 693e8ab6..d73926ad 100644 --- a/new-site/public/library/hackbook/index.xml +++ b/new-site/public/library/hackbook/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/library/index.xml b/new-site/public/library/index.xml index d605ce7f..445e1d1a 100644 --- a/new-site/public/library/index.xml +++ b/new-site/public/library/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/library/ted-kaczynski/index.xml b/new-site/public/library/ted-kaczynski/index.xml index 930d3a83..413eeb09 100644 --- a/new-site/public/library/ted-kaczynski/index.xml +++ b/new-site/public/library/ted-kaczynski/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/library/ted-kaczynski/ship-of-fools/index.html b/new-site/public/library/ted-kaczynski/ship-of-fools/index.html index fd68cb0c..84bf9a00 100644 --- a/new-site/public/library/ted-kaczynski/ship-of-fools/index.html +++ b/new-site/public/library/ted-kaczynski/ship-of-fools/index.html @@ -66,6 +66,7 @@
diff --git a/new-site/public/sitemap.xml b/new-site/public/sitemap.xml index f85765eb..7227507d 100644 --- a/new-site/public/sitemap.xml +++ b/new-site/public/sitemap.xml @@ -2,10 +2,19 @@ - https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ - 2023-04-01T14:48:01+03:00 + https://vodoraslo.xyz/tags/ + 2023-04-05T16:58:44+03:00 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + 2023-04-05T16:58:44+03:00 + + https://vodoraslo.xyz/updates/ + 2023-04-05T16:58:44+03:00 https://vodoraslo.xyz/ + 2023-04-05T16:58:44+03:00 + + https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ 2023-04-01T14:48:01+03:00 https://vodoraslo.xyz/library/ @@ -40,9 +49,6 @@ https://vodoraslo.xyz/blog/recover-lost-anki-streak/ 2023-01-12T21:34:30+02:00 - - https://vodoraslo.xyz/tags/ - 2023-01-12T21:34:30+02:00 https://vodoraslo.xyz/blog/meta-description-in-hugo/ 2023-01-04T22:52:24+02:00 @@ -52,9 +58,6 @@ https://vodoraslo.xyz/tags/hackbook/ 2023-01-03T22:32:11+02:00 - - https://vodoraslo.xyz/updates/ - 2022-12-27T14:24:24+02:00 https://vodoraslo.xyz/tags/updates/ 2022-12-27T14:24:24+02:00 diff --git a/new-site/public/tags/blog/index.xml b/new-site/public/tags/blog/index.xml index f0f6461e..75e5af7a 100644 --- a/new-site/public/tags/blog/index.xml +++ b/new-site/public/tags/blog/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/tags/hackbook/index.xml b/new-site/public/tags/hackbook/index.xml index c3cfc374..5b944beb 100644 --- a/new-site/public/tags/hackbook/index.xml +++ b/new-site/public/tags/hackbook/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/tags/index.xml b/new-site/public/tags/index.xml index e403b594..1282a35f 100644 --- a/new-site/public/tags/index.xml +++ b/new-site/public/tags/index.xml @@ -5,11 +5,38 @@ Recent content in Tags on vodoraslo Hugo -- gohugo.io en-us - Thu, 12 Jan 2023 21:34:30 +0200 + Wed, 05 Apr 2023 16:58:44 +0300 + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/tags/updates/index.html b/new-site/public/tags/updates/index.html index 0ecdeef5..d0284cff 100644 --- a/new-site/public/tags/updates/index.html +++ b/new-site/public/tags/updates/index.html @@ -17,6 +17,7 @@
diff --git a/new-site/public/tags/updates/index.xml b/new-site/public/tags/updates/index.xml index 9202231f..7a4928d6 100644 --- a/new-site/public/tags/updates/index.xml +++ b/new-site/public/tags/updates/index.xml @@ -10,6 +10,33 @@ + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/updates/index.html b/new-site/public/updates/index.html index 0ecdeef5..d0284cff 100644 --- a/new-site/public/updates/index.html +++ b/new-site/public/updates/index.html @@ -17,6 +17,7 @@
diff --git a/new-site/public/updates/index.xml b/new-site/public/updates/index.xml index 5ce048c6..26995707 100644 --- a/new-site/public/updates/index.xml +++ b/new-site/public/updates/index.xml @@ -5,11 +5,38 @@ Recent content in Updates on vodoraslo Hugo -- gohugo.io en-us - Tue, 27 Dec 2022 14:24:24 +0200 + Wed, 05 Apr 2023 16:58:44 +0300 + + Updated the Css Again (prefers-color-scheme) + https://vodoraslo.xyz/updates/updated-the-css-again/ + Wed, 05 Apr 2023 16:58:44 +0300 + + https://vodoraslo.xyz/updates/updated-the-css-again/ + <p>I actually updated the css once more.</p> +<p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p> +<p>I did this by setting the light theme to be by default for more readability:</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#fafafa</span>; +</span></span><span style="display:flex;"><span> --fg: <span style="color:#ae81ff">#2f343f</span>; +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#4084d6</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">93</span>, <span style="color:#ae81ff">99</span>); +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p> +<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">prefers-color-scheme</span><span style="color:#f92672">:</span> <span style="color:#f92672">dark</span><span style="color:#f92672">)</span> { +</span></span><span style="display:flex;"><span> :<span style="color:#a6e22e">root</span> { +</span></span><span style="display:flex;"><span> --bg: <span style="color:#ae81ff">#141414</span>; +</span></span><span style="display:flex;"><span> --fg: rgb(<span style="color:#ae81ff">232</span>, <span style="color:#ae81ff">228</span>, <span style="color:#ae81ff">228</span>); +</span></span><span style="display:flex;"><span> --links: <span style="color:#ae81ff">#5da0f2</span>; +</span></span><span style="display:flex;"><span> --muted_text: rgb(<span style="color:#ae81ff">179</span>, <span style="color:#ae81ff">182</span>, <span style="color:#ae81ff">186</span>); +</span></span><span style="display:flex;"><span> } +</span></span><span style="display:flex;"><span>} +</span></span></code></pre></div> + + Ship of Fools https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/ diff --git a/new-site/public/updates/updated-the-css-again/index.html b/new-site/public/updates/updated-the-css-again/index.html new file mode 100644 index 00000000..01223ec6 --- /dev/null +++ b/new-site/public/updates/updated-the-css-again/index.html @@ -0,0 +1,58 @@ + + + + Updated the Css Again (Prefers-Color-Scheme) | vodoraslo + + + + + + + + + + + +
+

Updated the Css Again (prefers-color-scheme)

+
+ +

I actually updated the css once more.

+

If you’re using a dark theme in your browser, the website will follow suit and change to darker colors.

+

I did this by setting the light theme to be by default for more readability:

+
:root {
+	--bg: #fafafa;
+	--fg: #2f343f;
+	--links: #4084d6;
+	--muted_text: rgb(93, 93, 99);
+}
+

and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn’t know this stuff existed, thought webshits just use java script for everything, but I guess I’m wrong.

+
@media (prefers-color-scheme: dark) {
+	:root {
+		--bg: #141414;	
+		--fg: rgb(232, 228, 228);
+		--links: #5da0f2;
+		--muted_text: rgb(179, 182, 186);
+	}
+}
+
+ + +
+ Tags: [Updates] +
+
+
+
+ + + + +