added new updates article about the changes to the css
This commit is contained in:
parent
ec052bd61f
commit
d1709e11bf
18 changed files with 408 additions and 12 deletions
33
new-site/content/updates/updated-the-css-again.md
Normal file
33
new-site/content/updates/updated-the-css-again.md
Normal file
|
@ -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);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/blog/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/blog/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -9,6 +9,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/categories/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/categories/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -29,6 +29,9 @@
|
||||||
<h3 id="recent-posts">Recent posts: <a class="anchor" href="#recent-posts">
|
<h3 id="recent-posts">Recent posts: <a class="anchor" href="#recent-posts">
|
||||||
<span class="spanForHeader">#</span>
|
<span class="spanForHeader">#</span>
|
||||||
</a></h3><ul class="tenRecentPosts">
|
</a></h3><ul class="tenRecentPosts">
|
||||||
|
<li><time datetime="2023-04-05T16:58:44+03:00">2023 Apr 05</time> – <a href="/updates/updated-the-css-again/"><b class="white_span">Updated the Css Again (prefers-color-scheme)</b></a> - <span class="muted_text">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 …</span> <a href="/updates/updated-the-css-again/">Read more</a> <em>(1 minutes read).</em></li>
|
||||||
<li><time datetime="2023-04-01T14:48:01+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/ship-of-fools/"><b class="white_span">Ship of Fools</b></a> - <span class="muted_text">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 …</span> <a href="/library/ted-kaczynski/ship-of-fools/">Read more</a> <em>(11 minutes read).</em></li>
|
<li><time datetime="2023-04-01T14:48:01+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/ship-of-fools/"><b class="white_span">Ship of Fools</b></a> - <span class="muted_text">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 …</span> <a href="/library/ted-kaczynski/ship-of-fools/">Read more</a> <em>(11 minutes read).</em></li>
|
||||||
<li><time datetime="2023-04-01T14:46:30+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/"><b class="white_span">The Long Term Outcome of Geo Engineering</b></a> - <span class="muted_text">In 2009, a correspondent asked me whether I thought nuclear weapons were the most dangerous aspect of modern technology. What follows is my reply, …</span> <a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/">Read more</a> <em>(4 minutes read).</em></li>
|
<li><time datetime="2023-04-01T14:46:30+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/"><b class="white_span">The Long Term Outcome of Geo Engineering</b></a> - <span class="muted_text">In 2009, a correspondent asked me whether I thought nuclear weapons were the most dangerous aspect of modern technology. What follows is my reply, …</span> <a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/">Read more</a> <em>(4 minutes read).</em></li>
|
||||||
<li><time datetime="2023-04-01T14:45:00+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/ecofascism-an-aberrant-branch-of-leftism/"><b class="white_span">Ecofascism an Aberrant Branch of Leftism</b></a> - <span class="muted_text">The “ecofascists,” as I understand that term, share, at a minimum, two traits:
|
<li><time datetime="2023-04-01T14:45:00+03:00">2023 Apr 01</time> – <a href="/library/ted-kaczynski/ecofascism-an-aberrant-branch-of-leftism/"><b class="white_span">Ecofascism an Aberrant Branch of Leftism</b></a> - <span class="muted_text">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
|
||||||
<li><time datetime="2023-03-23T18:06:34+02:00">2023 Mar 23</time> – <a href="/library/ted-kaczynski/industrial-society-and-its-future/"><b class="white_span">Industrial Society and Its Future </b></a> - <span class="muted_text">Introduction #
The Industrial Revolution and its consequences have been a disaster for the human race. They have greatly increased the life expectancy …</span> <a href="/library/ted-kaczynski/industrial-society-and-its-future/">Read more</a> <em>(159 minutes read).</em></li>
|
<li><time datetime="2023-03-23T18:06:34+02:00">2023 Mar 23</time> – <a href="/library/ted-kaczynski/industrial-society-and-its-future/"><b class="white_span">Industrial Society and Its Future </b></a> - <span class="muted_text">Introduction #
The Industrial Revolution and its consequences have been a disaster for the human race. They have greatly increased the life expectancy …</span> <a href="/library/ted-kaczynski/industrial-society-and-its-future/">Read more</a> <em>(159 minutes read).</em></li>
|
||||||
<li><time datetime="2023-01-12T21:34:30+02:00">2023 Jan 12</time> – <a href="/blog/recover-lost-anki-streak/"><b class="white_span">Recover Lost Anki Streak</b></a> - <span class="muted_text">How to recover a lost anki streak #
Word for word copy paste of what fixed my issue. Original post
|
<li><time datetime="2023-01-12T21:34:30+02:00">2023 Jan 12</time> – <a href="/blog/recover-lost-anki-streak/"><b class="white_span">Recover Lost Anki Streak</b></a> - <span class="muted_text">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 …</span> <a href="/blog/recover-lost-anki-streak/">Read more</a> <em>(1 minutes read).</em></li>
|
btw i had to create a seperate Custom Study for …</span> <a href="/blog/recover-lost-anki-streak/">Read more</a> <em>(1 minutes read).</em></li>
|
||||||
<li><time datetime="2023-01-04T22:52:24+02:00">2023 Jan 04</time> – <a href="/blog/meta-description-in-hugo/"><b class="white_span">Meta Description in Hugo</b></a> - <span class="muted_text">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 …</span> <a href="/blog/meta-description-in-hugo/">Read more</a> <em>(1 minutes read).</em></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,11 +5,38 @@
|
||||||
<description>Recent content on vodoraslo</description>
|
<description>Recent content on vodoraslo</description>
|
||||||
<generator>Hugo -- gohugo.io</generator>
|
<generator>Hugo -- gohugo.io</generator>
|
||||||
<language>en-us</language>
|
<language>en-us</language>
|
||||||
<lastBuildDate>Sat, 01 Apr 2023 14:48:01 +0300</lastBuildDate>
|
<lastBuildDate>Wed, 05 Apr 2023 16:58:44 +0300</lastBuildDate>
|
||||||
|
|
||||||
<atom:link href="https://vodoraslo.xyz/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/library/hackbook/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/library/hackbook/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/library/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/library/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/library/ted-kaczynski/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/library/ted-kaczynski/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -66,6 +66,7 @@
|
||||||
|
|
||||||
<div id="nextprev">
|
<div id="nextprev">
|
||||||
<a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/"><div id="prevart">Previous:<br>The Long Term Outcome of Geo Engineering</div></a>
|
<a href="/library/ted-kaczynski/the-long-term-outcome-of-geo-engineering/"><div id="prevart">Previous:<br>The Long Term Outcome of Geo Engineering</div></a>
|
||||||
|
<a href="/updates/updated-the-css-again/"><div id="nextart">Next:<br>Updated the Css Again (prefers-color-scheme)</div></a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
|
|
|
@ -2,10 +2,19 @@
|
||||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
||||||
xmlns:xhtml="http://www.w3.org/1999/xhtml">
|
xmlns:xhtml="http://www.w3.org/1999/xhtml">
|
||||||
<url>
|
<url>
|
||||||
<loc>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</loc>
|
<loc>https://vodoraslo.xyz/tags/</loc>
|
||||||
<lastmod>2023-04-01T14:48:01+03:00</lastmod>
|
<lastmod>2023-04-05T16:58:44+03:00</lastmod>
|
||||||
|
</url><url>
|
||||||
|
<loc>https://vodoraslo.xyz/updates/updated-the-css-again/</loc>
|
||||||
|
<lastmod>2023-04-05T16:58:44+03:00</lastmod>
|
||||||
|
</url><url>
|
||||||
|
<loc>https://vodoraslo.xyz/updates/</loc>
|
||||||
|
<lastmod>2023-04-05T16:58:44+03:00</lastmod>
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/</loc>
|
<loc>https://vodoraslo.xyz/</loc>
|
||||||
|
<lastmod>2023-04-05T16:58:44+03:00</lastmod>
|
||||||
|
</url><url>
|
||||||
|
<loc>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</loc>
|
||||||
<lastmod>2023-04-01T14:48:01+03:00</lastmod>
|
<lastmod>2023-04-01T14:48:01+03:00</lastmod>
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/library/</loc>
|
<loc>https://vodoraslo.xyz/library/</loc>
|
||||||
|
@ -40,9 +49,6 @@
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/blog/recover-lost-anki-streak/</loc>
|
<loc>https://vodoraslo.xyz/blog/recover-lost-anki-streak/</loc>
|
||||||
<lastmod>2023-01-12T21:34:30+02:00</lastmod>
|
<lastmod>2023-01-12T21:34:30+02:00</lastmod>
|
||||||
</url><url>
|
|
||||||
<loc>https://vodoraslo.xyz/tags/</loc>
|
|
||||||
<lastmod>2023-01-12T21:34:30+02:00</lastmod>
|
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/blog/meta-description-in-hugo/</loc>
|
<loc>https://vodoraslo.xyz/blog/meta-description-in-hugo/</loc>
|
||||||
<lastmod>2023-01-04T22:52:24+02:00</lastmod>
|
<lastmod>2023-01-04T22:52:24+02:00</lastmod>
|
||||||
|
@ -52,9 +58,6 @@
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/tags/hackbook/</loc>
|
<loc>https://vodoraslo.xyz/tags/hackbook/</loc>
|
||||||
<lastmod>2023-01-03T22:32:11+02:00</lastmod>
|
<lastmod>2023-01-03T22:32:11+02:00</lastmod>
|
||||||
</url><url>
|
|
||||||
<loc>https://vodoraslo.xyz/updates/</loc>
|
|
||||||
<lastmod>2022-12-27T14:24:24+02:00</lastmod>
|
|
||||||
</url><url>
|
</url><url>
|
||||||
<loc>https://vodoraslo.xyz/tags/updates/</loc>
|
<loc>https://vodoraslo.xyz/tags/updates/</loc>
|
||||||
<lastmod>2022-12-27T14:24:24+02:00</lastmod>
|
<lastmod>2022-12-27T14:24:24+02:00</lastmod>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/tags/blog/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/tags/blog/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/tags/hackbook/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/tags/hackbook/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -5,11 +5,38 @@
|
||||||
<description>Recent content in Tags on vodoraslo</description>
|
<description>Recent content in Tags on vodoraslo</description>
|
||||||
<generator>Hugo -- gohugo.io</generator>
|
<generator>Hugo -- gohugo.io</generator>
|
||||||
<language>en-us</language>
|
<language>en-us</language>
|
||||||
<lastBuildDate>Thu, 12 Jan 2023 21:34:30 +0200</lastBuildDate>
|
<lastBuildDate>Wed, 05 Apr 2023 16:58:44 +0300</lastBuildDate>
|
||||||
|
|
||||||
<atom:link href="https://vodoraslo.xyz/tags/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/tags/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -17,6 +17,7 @@
|
||||||
<article>
|
<article>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
|
<li><time datetime="2023-04-05T16:58:44+03:00">2023 Apr 05</time> – <a href="/updates/updated-the-css-again/">Updated the Css Again (prefers-color-scheme)</a></li>
|
||||||
<li><time datetime="2022-12-27T14:24:24+02:00">2022 Dec 27</time> – <a href="/updates/yoinked-css/">Yoinked some Css and updated the site</a></li>
|
<li><time datetime="2022-12-27T14:24:24+02:00">2022 Dec 27</time> – <a href="/updates/yoinked-css/">Yoinked some Css and updated the site</a></li>
|
||||||
<li><time datetime="2022-12-17T17:20:18+02:00">2022 Dec 17</time> – <a href="/updates/helloworld/">Hello world</a></li>
|
<li><time datetime="2022-12-17T17:20:18+02:00">2022 Dec 17</time> – <a href="/updates/helloworld/">Hello world</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -10,6 +10,33 @@
|
||||||
<atom:link href="https://vodoraslo.xyz/tags/updates/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/tags/updates/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
|
@ -17,6 +17,7 @@
|
||||||
<article>
|
<article>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
|
<li><time datetime="2023-04-05T16:58:44+03:00">2023 Apr 05</time> – <a href="/updates/updated-the-css-again/">Updated the Css Again (prefers-color-scheme)</a></li>
|
||||||
<li><time datetime="2022-12-27T14:24:24+02:00">2022 Dec 27</time> – <a href="/updates/yoinked-css/">Yoinked some Css and updated the site</a></li>
|
<li><time datetime="2022-12-27T14:24:24+02:00">2022 Dec 27</time> – <a href="/updates/yoinked-css/">Yoinked some Css and updated the site</a></li>
|
||||||
<li><time datetime="2022-12-17T17:20:18+02:00">2022 Dec 17</time> – <a href="/updates/helloworld/">Hello world</a></li>
|
<li><time datetime="2022-12-17T17:20:18+02:00">2022 Dec 17</time> – <a href="/updates/helloworld/">Hello world</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -5,11 +5,38 @@
|
||||||
<description>Recent content in Updates on vodoraslo</description>
|
<description>Recent content in Updates on vodoraslo</description>
|
||||||
<generator>Hugo -- gohugo.io</generator>
|
<generator>Hugo -- gohugo.io</generator>
|
||||||
<language>en-us</language>
|
<language>en-us</language>
|
||||||
<lastBuildDate>Tue, 27 Dec 2022 14:24:24 +0200</lastBuildDate>
|
<lastBuildDate>Wed, 05 Apr 2023 16:58:44 +0300</lastBuildDate>
|
||||||
|
|
||||||
<atom:link href="https://vodoraslo.xyz/updates/index.xml" rel="self" type="application/rss+xml" />
|
<atom:link href="https://vodoraslo.xyz/updates/index.xml" rel="self" type="application/rss+xml" />
|
||||||
|
|
||||||
|
|
||||||
|
<item>
|
||||||
|
<title>Updated the Css Again (prefers-color-scheme)</title>
|
||||||
|
<link>https://vodoraslo.xyz/updates/updated-the-css-again/</link>
|
||||||
|
<pubDate>Wed, 05 Apr 2023 16:58:44 +0300</pubDate>
|
||||||
|
|
||||||
|
<guid>https://vodoraslo.xyz/updates/updated-the-css-again/</guid>
|
||||||
|
<description><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></description>
|
||||||
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
<title>Ship of Fools</title>
|
<title>Ship of Fools</title>
|
||||||
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
<link>https://vodoraslo.xyz/library/ted-kaczynski/ship-of-fools/</link>
|
||||||
|
|
58
new-site/public/updates/updated-the-css-again/index.html
Normal file
58
new-site/public/updates/updated-the-css-again/index.html
Normal file
|
@ -0,0 +1,58 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<title>Updated the Css Again (Prefers-Color-Scheme) | vodoraslo</title>
|
||||||
|
<link rel="canonical" href="https://vodoraslo.xyz/">
|
||||||
|
<link rel='alternate' type='application/rss+xml' title="vodoraslo RSS" href='/index.xml'>
|
||||||
|
<link rel='stylesheet' type='text/css' href='/style.css'>
|
||||||
|
<link rel="icon" href="/favicon.ico">
|
||||||
|
<meta name="description" content="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."/>
|
||||||
|
<meta name="keywords" content="updates">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta name="robots" content="index, follow">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main>
|
||||||
|
<header><h1 id="tag_Updated the Css Again (prefers-color-scheme)">Updated the Css Again (prefers-color-scheme)</h1></header>
|
||||||
|
<article>
|
||||||
|
|
||||||
|
<p>I actually updated the css once more.</p>
|
||||||
|
<p>If you’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’t know this stuff existed, thought webshits just use java script for everything, but I guess I’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>
|
||||||
|
|
||||||
|
<div id="nextprev">
|
||||||
|
<a href="/library/ted-kaczynski/ship-of-fools/"><div id="prevart">Previous:<br>Ship of Fools</div></a>
|
||||||
|
</div>
|
||||||
|
<div style="clear:both" class=taglist>
|
||||||
|
Tags: [<a id="tag_updates" href="https://vodoraslo.xyz/tags/updates">Updates</a>]
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<a href="https://vodoraslo.xyz/">Homepage</a> <div><a href="/index.xml"><img src="/rss.svg" style="max-height:1.5em" alt="RSS Feed" title="Subscribe via RSS for updates."></a></div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in a new issue