Caching and styling

app/assets/index.css

@@ -6,16 +6,19 @@
 @font-face {
     font-family: "Rubik";
     src: url("/assets/Rubik-VariableFont_wght.ttf") format("truetype");
+    font-display: swap;
 }
 
 @font-face {
     font-family: "JetBrainsMono";
     src: url("/assets/JetBrainsMono-VariableFont_wght.ttf") format("truetype");
+    font-display: swap;
 }
 
 @font-face {
     font-family: "Karla";
     src: url("/assets/Karla-VariableFont_wght.ttf") format("truetype");
+    font-display: swap;
 }
 
 * {

app/templates/shared/_bookmark.html.slim

@@ -1,7 +1,7 @@
 div class="mb-8"
-  h3 class="text-xl font-bold text-blue-600 hover:underline"
-    a href="#{bookmark.url}"
-      = "🔖 #{bookmark.name} "
+  h3 class="text-xl font-bold text-blue-600 mb-2"
+    a class="u-url border-b-2 border-transparent hover:border-blue-600 hover:border-b-2" href="#{bookmark.url}"
+      = "#{bookmark.name} "
       == render("link_arrow")
   p class="e-content leading-relaxed md:text-lg text-gray-800 dark:text-gray-200"
     = bookmark.content

app/templates/shared/_post.html.slim

@@ -1,6 +1,6 @@
 div class="mb-8 h-entry"
-  h3 class="text-xl font-bold text-blue-600 hover:underline"
-    a class="u-url" href="/post/#{post.slug}"
+  h3 class="text-xl font-semibold text-blue-600 mb-2"
+    a class="u-url border-b-2 border-transparent hover:border-blue-600 hover:border-b-2" href="/post/#{post.slug}"
       = post.display_title
   div class="e-content p-name text-base text-gray-800 dark:text-gray-200"
     == post.excerpt