From b097ad035a089076b6cf1f1e9c7f648439d9b073 Mon Sep 17 00:00:00 2001
From: Mitja Felicijan <m@mitjafelicijan.com>
Date: Mon, 3 Jul 2023 01:38:05 +0200
Subject: Bunch of CSS improvements

---
 themes/simple/layouts/_default/list.html          |  4 +-
 themes/simple/layouts/_default/notes.html         |  4 +-
 themes/simple/layouts/partials/comments.html      |  4 +-
 themes/simple/layouts/partials/navigation.html    | 16 ++---
 themes/simple/layouts/partials/read-more.html     | 12 ++--
 themes/simple/layouts/partials/side-projects.html | 71 +++++++++++++----------
 themes/simple/layouts/tags/list.html              |  2 +-
 themes/simple/openring/openring.html              | 10 ++--
 themes/simple/static/css/tailwind.css             | 10 ++--
 9 files changed, 70 insertions(+), 63 deletions(-)

(limited to 'themes/simple')

diff --git a/themes/simple/layouts/_default/list.html b/themes/simple/layouts/_default/list.html
index f92d9c0..6362b0f 100644
--- a/themes/simple/layouts/_default/list.html
+++ b/themes/simple/layouts/_default/list.html
@@ -22,8 +22,8 @@
     {{ range (where .Site.RegularPages "Section" "posts") }}
     <div>
       <article class="mb-5" itemscope itemtype="http://schema.org/Article">
-        <time class="block text-gray-400 font-medium text-xs">{{ .Date.Format "Monday Jan 2, 2006" }}</time>
-        <a href="/{{ .Params.url }}" itemprop="url" class="hover:bg-yellow-100" rel="bookmark noopener" aria-label="Opens URL">
+        <time class="block text-gray-400 font-medium text-xs mb-1">{{ .Date.Format "Monday Jan 2, 2006" }}</time>
+        <a href="/{{ .Params.url }}" itemprop="url" class="underline" rel="bookmark noopener" aria-label="Opens URL">
           {{ if .Params.draft }}
           <span class="bg-orange-600 text-white px-1.5">Draft</span>
           {{ end }}
diff --git a/themes/simple/layouts/_default/notes.html b/themes/simple/layouts/_default/notes.html
index 02560b0..f624814 100644
--- a/themes/simple/layouts/_default/notes.html
+++ b/themes/simple/layouts/_default/notes.html
@@ -9,7 +9,7 @@
     <p class="text-gray-600 italic">
       Notes about things I learn, things I do, things I want to remember,
       but never do. You can subscribe to this
-      <a href="/notes/index.xml" class="underline hover:bg-yellow-100">RSS feed</a>
+      <a href="/notes/index.xml" class="underline">RSS feed</a>
       which contains only the notes without the blog posts.
     </p>
   </section>
@@ -28,7 +28,7 @@
       <ul class="flex flex-wrap gap-2">
         {{ range .Site.Taxonomies.tags }}
         <li>
-          <a href="{{ .Page.Permalink }}" class="inline-block px-3 py-1 rounded bg-gray-100 hover:bg-yellow-100">
+          <a href="{{ .Page.Permalink }}" class="inline-block px-3 py-1 rounded bg-gray-100 hover:bg-yellow-200">
             {{ .Page.Title }}
           </a>
         </li>
diff --git a/themes/simple/layouts/partials/comments.html b/themes/simple/layouts/partials/comments.html
index c87f1c6..50c28ca 100644
--- a/themes/simple/layouts/partials/comments.html
+++ b/themes/simple/layouts/partials/comments.html
@@ -3,7 +3,7 @@
 
   <p class="mb-10">
     You can write me an email at
-    <a href="mailto:m@mitjafelicijan.com" class="underline-offset-2 underline hover:bg-yellow-100">m@mitjafelicijan.com</a> or catch up with me
-    <a href="https://telegram.me/mitjafelicijan" target="_blank" class="underline-offset-2 underline hover:bg-yellow-100">on Telegram</a>.
+    <a href="mailto:m@mitjafelicijan.com" class="underline-offset-2 underline">m@mitjafelicijan.com</a> or catch up with me
+    <a href="https://telegram.me/mitjafelicijan" target="_blank" class="underline-offset-2 underline">on Telegram</a>.
   </p>
 </section>
diff --git a/themes/simple/layouts/partials/navigation.html b/themes/simple/layouts/partials/navigation.html
index 44c6059..9c13fe5 100644
--- a/themes/simple/layouts/partials/navigation.html
+++ b/themes/simple/layouts/partials/navigation.html
@@ -1,7 +1,7 @@
 <div class="container-blog mx-auto px-6 md:p-0">
   <header class="flex py-4 mt-4 mb-8 flex-col md:flex-row items-center ">
     <div class="flex-grow mb-2 md:mb-0">
-      <a href="/" itemprop="url" class="text-xl font-semibold hover:bg-yellow-100">Mitja Felicijan</a>
+      <a href="/" itemprop="url" class="text-xl font-semibold hover:underline">Mitja Felicijan</a>
     </div>
 
     <nav itemscope itemtype="http://schema.org/SiteNavigationElement" class="flex items-center gap-1" role="toolbar">
@@ -17,13 +17,13 @@
         </span>
       </span>
 
-      <a href="/notes.html" class="font-medium px-2 hover:bg-yellow-100">Notes</a>
-      <a href="https://telegram.me/mitjafelicijan" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-100">Telegram</a>
-      <a href="https://git.mitjafelicijan.com" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-100">Git</a>
-      <a href="https://files.mitjafelicijan.com" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-100 hidden md:block">Files</a>
-      <a href="/mitjafelicijan.gpg.pub.txt" itemprop="url" class="font-medium px-2 hover:bg-yellow-100">GPG</a>
-      <a href="/curriculum-vitae.html" class="font-medium px-2 hover:bg-yellow-100">CV</a>
-      <a href="/index.xml" itemprop="url" class="font-medium px-2 hover:bg-yellow-100 hidden md:block">RSS</a>
+      <a href="/notes.html" class="font-medium px-2 hover:bg-yellow-200 rounded">Notes</a>
+      <a href="https://telegram.me/mitjafelicijan" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-200 rounded">Telegram</a>
+      <a href="https://git.mitjafelicijan.com" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-200 rounded">Git</a>
+      <a href="https://files.mitjafelicijan.com" target="_blank" rel="noopener nofollow" itemprop="url" class="font-medium px-2 hover:bg-yellow-200 rounded hidden md:block">Files</a>
+      <a href="/mitjafelicijan.gpg.pub.txt" itemprop="url" class="font-medium px-2 hover:bg-yellow-200 rounded">GPG</a>
+      <a href="/curriculum-vitae.html" class="font-medium px-2 hover:bg-yellow-200 rounded">CV</a>
+      <a href="/index.xml" itemprop="url" class="font-medium px-2 hover:bg-yellow-200 rounded hidden md:block">RSS</a>
     </nav>
   </header>
 </div>
diff --git a/themes/simple/layouts/partials/read-more.html b/themes/simple/layouts/partials/read-more.html
index a238017..9de1554 100644
--- a/themes/simple/layouts/partials/read-more.html
+++ b/themes/simple/layouts/partials/read-more.html
@@ -2,15 +2,15 @@
   <h2 class="text-2xl font-bold mb-6">Read more from this site</h2>
   <nav itemscope itemtype="https://schema.org/SiteNavigationElement" class="mb-12">
     <meta itemprop="name" content="Article list">
-    <ul>
+    <nav class="flex flex-col gap-4">
       {{ $randomPosts := shuffle (where .Site.RegularPages "Type" "posts") | first 5 }}
       {{ range $randomPosts }}
-      <li class="mb-6">
+      <div>
         <time class="block text-gray-400 font-medium text-xs">{{ .Date.Format "Mon Jan 2, 2006" }}</time>
-        <a href="/{{ .Params.url }}" itemprop="url" class="hover:bg-yellow-100 font-medium">{{ .Title }}</a>
+        <a href="/{{ .Params.url }}" itemprop="url" class="block underline font-medium mb-1">{{ .Title }}</a>
         <p class="text-gray-600 text-sm">{{ .Summary }}</p>
-      </li>
+      </div>
       {{ end }}
-    </ul>
+    </nav>
   </nav>
-</section>
\ No newline at end of file
+</section>
diff --git a/themes/simple/layouts/partials/side-projects.html b/themes/simple/layouts/partials/side-projects.html
index f675803..a2256e7 100644
--- a/themes/simple/layouts/partials/side-projects.html
+++ b/themes/simple/layouts/partials/side-projects.html
@@ -1,33 +1,40 @@
 <section class="mb-12">
-  <h2 class="text-2xl font-bold mb-6">Side projects I worked on</h2>
-  <ul class="list-disc ml-6">
-    <li>
-      <a href="https://git.mitjafelicijan.com/cord.h.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">cord.h - Small C library for handling strings</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/mprogress.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">mprogress - Tiny utility that displays progress bar in terminal</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/journalctl-proxy.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">journalctl-proxy - Exposes your systemd logs to web via web interface</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/redis-marshal.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">redis-marshal - Lightweight Redis data exploration tool</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/dna-encoding.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">dna-encoding - Tools for encoding files to DNA sequence</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/vertex.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">vertex - Create mock API's and add basic logic to simplify prototyping</a>
-    </li>
-    <li>
-      <a href="https://git.mitjafelicijan.com/scarecrow.git/" target="_blank" rel="noopener nofollow"
-        class="hover:bg-yellow-100">scarecrow - Minimal configuration reverse proxy</a>
-    </li>
-  </ul>
-</section>
\ No newline at end of file
+  <h2 class="text-2xl font-bold mb-6">Side projects I work/worked on</h2>
+
+  <nav class="flex flex-col gap-4 md:gap-0 md:border w-full mb-4">
+    <a href="https://git.mitjafelicijan.com/cord.h.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">cord.h</span>
+      <span>Small C library for handling strings</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/mprogress.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">mprogress</span>
+      <span>Tiny utility that displays progress bar in terminal</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/journalctl-proxy.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">journalctl-proxy</span>
+      <span>Exposes your systemd logs to web via web interface</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/redis-marshal.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">redis-marshal</span>
+      <span>Lightweight Redis data exploration tool</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/dna-encoding.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">dna-encoding</span>
+      <span>Tools for encoding files to DNA sequence</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/vertex.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200 md:border-b">
+      <span class="inline-block md:w-40 underline">vertex</span>
+      <span>Create mock API's and add basic logic to simplify prototyping</span>
+    </a>
+    <a href="https://git.mitjafelicijan.com/scarecrow.git/" target="_blank" rel="noopener nofollow" class="block md:p-3 hover:bg-yellow-200">
+      <span class="inline-block md:w-40 underline">scarecrow</span>
+      <span>Minimal configuration reverse proxy</span>
+    </a>
+  </nav>
+
+  <p class="text-gray-500 italic">* For more projects, check out
+  my <a href="https://git.mitjafelicijan.com/" class="underline">Git
+  server</a>. Most of the projects there are probably work in progress and
+  should be considered as such.</p>
+
+</section>
diff --git a/themes/simple/layouts/tags/list.html b/themes/simple/layouts/tags/list.html
index 7917301..bd3bd57 100644
--- a/themes/simple/layouts/tags/list.html
+++ b/themes/simple/layouts/tags/list.html
@@ -15,7 +15,7 @@
     <p class="text-gray-600 italic">
       Notes about things I learn, things I do, things I want to remember,
       but never do. You can subscribe to this
-      <a href="/notes.xml" class="underline hover:bg-yellow-100">RSS feed</a>
+      <a href="/notes.xml" class="underline">RSS feed</a>
       which contains only the notes without the blog posts.
     </p>
   </section>
diff --git a/themes/simple/openring/openring.html b/themes/simple/openring/openring.html
index 8bc92f5..2ed2a86 100644
--- a/themes/simple/openring/openring.html
+++ b/themes/simple/openring/openring.html
@@ -1,11 +1,11 @@
 <section class="mb-10">
   <h2 class="text-2xl font-bold mb-6">Articles from blogs I follow around the net</h2>
 
-  <section>
+  <section class="grid md:grid-cols-2 gap-10">
     {{ range .Articles }}
-    <article class="mb-6">
-      <a href="{{ .Link }}" target="_blank" rel="noopener" class="font-medium mb-1 hover:bg-yellow-100">{{ .Title }}</a>
-      <p class="mb-1 text-sm text-gray-600">{{ .Summary }}</p>
+    <article class="flex flex-col gap-1">
+      <a href="{{ .Link }}" target="_blank" rel="noopener" class="font-medium rounded underline">{{ .Title }}</a>
+      <p class="text-sm text-gray-600">{{ .Summary }}</p>
       <div class="text-gray-500 font-medium text-xs">
         Via <a href="{{ .SourceLink }}" class="underline">{{ .SourceTitle }}</a>
         on {{ .Date | datef "January 2, 2006" }}
@@ -17,4 +17,4 @@
   <p class="text-sm text-gray-500">
     <a href="https://git.sr.ht/~sircmpwn/openring" class="no-underline hover:underline">Generated with openring.</a>
   </p>
-</section>
\ No newline at end of file
+</section>
diff --git a/themes/simple/static/css/tailwind.css b/themes/simple/static/css/tailwind.css
index 7d04496..9de02d7 100644
--- a/themes/simple/static/css/tailwind.css
+++ b/themes/simple/static/css/tailwind.css
@@ -2,7 +2,7 @@
 @tailwind components;
 @tailwind utilities;
 
-/* * { cursor: url(/general/9front-cursor.png), auto; } */
+* { cursor: url(/general/9front-cursor.png), auto; }
 
 /* Container */
 .container-blog {
@@ -11,11 +11,11 @@
 
 /* User text selection */
 ::selection {
-	@apply bg-yellow-100 text-black;
+	@apply bg-yellow-200 text-black;
 }
 
 ::-moz-selection {
-	@apply bg-yellow-100 text-black;
+	@apply bg-yellow-200 text-black;
 }
 
 /* Helpers */
@@ -52,7 +52,7 @@ article.single p {
 
 /* Links */
 article.single a {
-	@apply underline-offset-2 underline hover:bg-yellow-100;
+	@apply underline-offset-2 underline;
 }
 
 /* Blockquote */
@@ -94,7 +94,7 @@ article.single audio {
 
 /* Code */
 article.single code {
-	@apply bg-yellow-100 rounded px-2 py-1 text-xs font-medium;
+	@apply bg-yellow-200 rounded px-2 py-1 text-xs font-medium;
 }
 
 article.single.note code {
-- 
cgit v1.2.3