paritybit.ca

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README | LICENSE

commit 9e2db106e8af203a38e8d6af4bbfc1abd4adcc76
parent 3726578bfd89f18707be1c0191f0e626c225ed7a
Author: Jake Bauer <jbauer@paritybit.ca>
Date:   Mon, 22 Jun 2020 22:04:55 -0400

Publish new blog post

Diffstat:
Mpages/blog.md | 1+
Apages/blog/my-lwn-theme.md | 83+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpages/home.md | 4++--
Mpublic/feeds/sitewide-feed.xml | 157+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Apublic/img/lwn-homepage-colours.png | 0
Apublic/img/lwn-we-colours.png | 0
Mpublic/sitemap.xml | 1+
Mstyle/main.css | 12++++++++++++
8 files changed, 256 insertions(+), 2 deletions(-)

diff --git a/pages/blog.md b/pages/blog.md @@ -20,6 +20,7 @@ href="https://social.paritybit.ca/@jbauer">Mastodon</a>. ### 2020 <ul> + <li>2020-06-22 <a href="blog/my-lwn-theme">My LWN Theme</a></li> <li>2020-06-21 <a href="blog/reflecting-on-50-days-of-blogging">Reflecting on 50 Days of Blogging</a></li> <li>2020-06-20 <a href="blog/how-to-create-an-rss-feed-for-your-blog-3">How to Create an RSS Feed for Your Blog — 3 — Automating Updates</a></li> <li>2020-06-19 <a href="blog/how-to-create-an-rss-feed-for-your-blog-2">How to Create an RSS Feed for Your Blog — 2 — The Basics</a></li> diff --git a/pages/blog/my-lwn-theme.md b/pages/blog/my-lwn-theme.md @@ -0,0 +1,83 @@ +## My LWN Theme + +[//]: # "A recent blog post by @amolith@social.nixnet.services about how he set up his LWN theme made me want to review my settings which I set up over a year ago." + +[//]: # "main.min.css" + +[//]: # + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-06-22 | + <b>Last Updated:</b> 2020-06-22 +</div> + +A [recent blog post by Amolith](https://secluded.site/lwn-theming/) about how he +set up his LWN theme made me want to review my settings and tweak them to fit a +colour scheme I now like (this website's theme) compared to what I set up over a +year ago. I spent some time switching all of the colours over to something that +would mimic this site, since I like this colour scheme, and I figured I'd post +about it too in case people are looking for more theme ideas: + +### Display Preferences + +| Option | Value | +|-----------------------------------------------|-----------| +| Page background colour | `#25252a` | +| Left column background | `#36363a` | +| Middle column background | `#36363a` | +| Headline background | `#36363a` | +| Form/byline background | `#36363a` | +| Sidebar background | `#36363a` | +| Text colour | `#cccccc` | +| Link colour | `#83b3d8` | +| Visited link colour | `#a696cc` | +| Quoted text (in email) colour | `#dc00dc` | +| Old (seen) comment background colour | `#111111` | +| Navigation box on printable page | Checked | +| Minimum width of main text column (em) | `40` | +| Maximum width of main text column (em) | `50` | +| Display old parent in unread comments screen | Unchecked | + +### New page engine preferences + +|Option | Value | +|---------------------------------------------|----------------------| +| Use the new page engine | Checked | +| Left column color | `#36363a` | +| Maximum width for handset presentation (em) | `48` | +| Fixed navigation menu on small screens | Checked | +| Font family to use | `browser-determined` | + +### Quoted text preferences + +| Option | Value | +|------------------------|-----------| +| Quoted text style | `italic` | +| Quoted text weight | `normal` | +| Quoted text colour | `#bb5555` | +| Quoted text background | `#25252a` | + +### Screenshots + +<figure> + <a href="/img/lwn-homepage-colours.png"><img + src="/img/lwn-homepage-colours.png"/></a> + <figcaption>The LWN homepage with my colourscheme.</figcaption> +</figure> + +<figure> + <a href="/img/lwn-we-colours.png"><img src="/img/lwn-we-colours.png"/></a> + <figcaption>An LWN Weekly Edition with my colourscheme.</figcaption> +</figure> + +### Conclusion + +I really appreciate that LWN exposes stylesheet settings so that users can set +their own themes. Aside from being the highest quality Linux (and sometimes +general Open Source) news source, that's a good reason to subscribe to them. + +_This is my fifty-second post for the +[#100DaysToOffload](https://social.paritybit.ca/tags/100DaysToOffload) +challenge. You can learn more about this challenge over at +[https://100daystooffload.com](https://100daystooffload.com)._ diff --git a/pages/home.md b/pages/home.md @@ -20,6 +20,8 @@ extent)! Access through `gopher://paritybit.ca` or `gemini://paritybit.ca`. src="/img/feed-icon.png" width="15" height="15" alt="Click for RSS Feed"/> </a> </div> +2020-06-22 <a class="feed-item" href="blog/my-lwn-theme">My LWN Theme</a> + 2020-06-21 <a class="feed-item" href="blog/reflecting-on-50-days-of-blogging">Reflecting on 50 Days of Blogging</a> 2020-06-20 <a class="feed-item" href="blog/how-to-create-an-rss-feed-for-your-blog-3">How to Create an RSS Feed for Your Blog — 3 — Automating Updates</a> @@ -37,8 +39,6 @@ extent)! Access through `gopher://paritybit.ca` or `gemini://paritybit.ca`. 2020-06-13 <a class="feed-item" href="blog/how-i-manage-my-dotfiles">How I Manage My Dotfiles</a> 2020-06-12 <a class="feed-item" href="blog/making-my-site-easier-to-read">Making My Site Easier to Read</a> - -2020-06-11 <a class="feed-item" href="blog/improving-my-blog-post-publishing-script">Improving My Blog Post Publishing Script</a> ### What is a Parity Bit? It is a bit (in the 1's and 0's sense) used in checking for errors in digital diff --git a/public/feeds/sitewide-feed.xml b/public/feeds/sitewide-feed.xml @@ -7,6 +7,163 @@ <description>The feed that covers all notable additions, updates, announcements, and other changes for the entire paritybit.ca website.</description> <item> + <title>My LWN Theme</title> + <link>https://www.paritybit.ca/blog/my-lwn-theme</link> + <guid>https://www.paritybit.ca/blog/my-lwn-theme</guid> + <pubDate>Mon, 22 Jun 2020 22:04:33 -0400</pubDate> + <description><![CDATA[<h2 id="my-lwn-theme">My LWN Theme</h2> +<div class="byline"> +<p><b>Written By:</b> Jake Bauer | <b>Posted:</b> 2020-06-22 | <b>Last Updated:</b> 2020-06-22</p> +</div> +<p>A <a href="https://secluded.site/lwn-theming/">recent blog post by Amolith</a> about how he set up his LWN theme made me want to review my settings and tweak them to fit a colour scheme I now like (this website’s theme) compared to what I set up over a year ago. I spent some time switching all of the colours over to something that would mimic this site, since I like this colour scheme, and I figured I’d post about it too in case people are looking for more theme ideas:</p> +<h3 id="display-preferences">Display Preferences</h3> +<table> +<thead> +<tr class="header"> +<th>Option</th> +<th>Value</th> +</tr> +</thead> +<tbody> +<tr class="odd"> +<td>Page background colour</td> +<td><code>#25252a</code></td> +</tr> +<tr class="even"> +<td>Left column background</td> +<td><code>#36363a</code></td> +</tr> +<tr class="odd"> +<td>Middle column background</td> +<td><code>#36363a</code></td> +</tr> +<tr class="even"> +<td>Headline background</td> +<td><code>#36363a</code></td> +</tr> +<tr class="odd"> +<td>Form/byline background</td> +<td><code>#36363a</code></td> +</tr> +<tr class="even"> +<td>Sidebar background</td> +<td><code>#36363a</code></td> +</tr> +<tr class="odd"> +<td>Text colour</td> +<td><code>#cccccc</code></td> +</tr> +<tr class="even"> +<td>Link colour</td> +<td><code>#83b3d8</code></td> +</tr> +<tr class="odd"> +<td>Visited link colour</td> +<td><code>#a696cc</code></td> +</tr> +<tr class="even"> +<td>Quoted text (in email) colour</td> +<td><code>#dc00dc</code></td> +</tr> +<tr class="odd"> +<td>Old (seen) comment background colour</td> +<td><code>#111111</code></td> +</tr> +<tr class="even"> +<td>Navigation box on printable page</td> +<td>Checked</td> +</tr> +<tr class="odd"> +<td>Minimum width of main text column (em)</td> +<td><code>40</code></td> +</tr> +<tr class="even"> +<td>Maximum width of main text column (em)</td> +<td><code>50</code></td> +</tr> +<tr class="odd"> +<td>Display old parent in unread comments screen</td> +<td>Unchecked</td> +</tr> +</tbody> +</table> +<h3 id="new-page-engine-preferences">New page engine preferences</h3> +<table> +<thead> +<tr class="header"> +<th>Option</th> +<th>Value</th> +</tr> +</thead> +<tbody> +<tr class="odd"> +<td>Use the new page engine</td> +<td>Checked</td> +</tr> +<tr class="even"> +<td>Left column color</td> +<td><code>#36363a</code></td> +</tr> +<tr class="odd"> +<td>Maximum width for handset presentation (em)</td> +<td><code>48</code></td> +</tr> +<tr class="even"> +<td>Fixed navigation menu on small screens</td> +<td>Checked</td> +</tr> +<tr class="odd"> +<td>Font family to use</td> +<td><code>browser-determined</code></td> +</tr> +</tbody> +</table> +<h3 id="quoted-text-preferences">Quoted text preferences</h3> +<table> +<thead> +<tr class="header"> +<th>Option</th> +<th>Value</th> +</tr> +</thead> +<tbody> +<tr class="odd"> +<td>Quoted text style</td> +<td><code>italic</code></td> +</tr> +<tr class="even"> +<td>Quoted text weight</td> +<td><code>normal</code></td> +</tr> +<tr class="odd"> +<td>Quoted text colour</td> +<td><code>#bb5555</code></td> +</tr> +<tr class="even"> +<td>Quoted text background</td> +<td><code>#25252a</code></td> +</tr> +</tbody> +</table> +<h3 id="screenshots">Screenshots</h3> +<figure> +<a href="/img/lwn-homepage-colours.png"><img + src="/img/lwn-homepage-colours.png"/></a> +<figcaption> +The LWN homepage with my colourscheme. +</figcaption> +</figure> +<figure> +<a href="/img/lwn-we-colours.png"><img src="/img/lwn-we-colours.png"/></a> +<figcaption> +An LWN Weekly Edition with my colourscheme. +</figcaption> +</figure> +<h3 id="conclusion">Conclusion</h3> +<p>I really appreciate that LWN exposes stylesheet settings so that users can set their own themes. Aside from being the highest quality Linux (and sometimes general Open Source) news source, that’s a good reason to subscribe to them.</p> +<p><em>This is my fifty-second post for the <a href="https://social.paritybit.ca/tags/100DaysToOffload">#100DaysToOffload</a> challenge. You can learn more about this challenge over at <a href="https://100daystooffload.com" class="uri">https://100daystooffload.com</a>.</em></p>]]></description> + </item> +<item> <title>Reflecting on 50 Days of Blogging</title> <link>https://www.paritybit.ca/blog/reflecting-on-50-days-of-blogging</link> <guid>https://www.paritybit.ca/blog/reflecting-on-50-days-of-blogging</guid> diff --git a/public/img/lwn-homepage-colours.png b/public/img/lwn-homepage-colours.png Binary files differ. diff --git a/public/img/lwn-we-colours.png b/public/img/lwn-we-colours.png Binary files differ. diff --git a/public/sitemap.xml b/public/sitemap.xml @@ -3,6 +3,7 @@ <url><loc>https://www.paritybit.ca</loc></url> <url><loc>https://www.paritybit.ca/home</loc></url> <url><loc>https://www.paritybit.ca/blog</loc></url> + <url><loc>https://www.paritybit.ca/blog/my-lwn-theme</loc></url> <url><loc>https://www.paritybit.ca/blog/reflecting-on-50-days-of-blogging</loc></url> <url><loc>https://www.paritybit.ca/blog/how-to-create-an-rss-feed-for-your-blog-3</loc></url> <url><loc>https://www.paritybit.ca/blog/how-to-create-an-rss-feed-for-your-blog-2</loc></url> diff --git a/style/main.css b/style/main.css @@ -99,6 +99,18 @@ button { padding: 4px 8px; } +table, th, td { + border: 2px solid var(--border-dark); + border-collapse: collapse; + text-align: left; + padding: 0.25em 0.5em; +} + +th { + color: var(--fg-bright); + background-color: var(--bg-bright); +} + .badge { display: inline-block; margin: 5px;