minor tweaks

config.yaml

@@ -12,6 +12,9 @@ menu:
     - name: BLOG
       pageRef: /blog
       weight: 20
+    - name: PROJECTS
+      pageRef: /projects
+      weight: 30
     - name: ABOUT
       pageRef: /about
       weight: 30

themes/saturn/static/css/main.css

@@ -39,12 +39,14 @@
 
     --main-bg: var(--jet);
     --content-bg: var(--raisin-black);
-    --primary-text: var(--pewter-blue);
+    --primary-text: var(--pale-silver);
-    --secondary-text: var(--base01);
+    --secondary-text: var(--pewter-blue);
     --primary-link: var(--chinese-red);
-    --primary-link-hover: var(--red);
+    --primary-link-hover: var(--pewter-blue);
-    --secondary-link: var(--blue);
+    --secondary-link: var(--cyan);
+    --secondary-link-hover: var(--pewter-blue);
     --ternary-link: var(--chinese-red);
+    --ternary-link-hover: var(--pewter-blue);
 }
 
 @font-face {
@@ -60,6 +62,7 @@
 body {
     background-color: var(--main-bg);
     color: var(--primary-text);
+    font-size: 16px;
     font-family: 'Krub', sans-serif;
     scrollbar-width: none;
     padding: 0;
@@ -71,7 +74,7 @@ body::-webkit-scrollbar {
 }
 
 h1,h2,h3,h4,h5,h6 {
-    color: var(--primary-text);
+    color: var(--secondary-text);
     font-family: 'B216 Mono', monospace;
 }
 
@@ -84,19 +87,27 @@ p {
     line-height: 1.8;
 }
 
+a {
+    transition: color 0.5s;
+}
+
 a:link, a:visited {
     color: var(--primary-link);
     text-decoration: none;
 }
 
 a:hover, a:active {
-    text-decoration: underline;
+    color: var(--primary-link-hover);
 }
 
 a.tag {
     color: var(--secondary-link);
 }
 
+a.tag:hover, a.tag:active {
+    color: var(--secondary-link-hover);
+}
+
 a.permalink {
     padding: 0 5px;
 }
@@ -167,6 +178,7 @@ header a.sitetitle {
 
 p#subtitle {
     text-align: center;
+    padding: 0 1em;
 }
 
 p.about {
@@ -195,6 +207,7 @@ span.rss {
 nav {
     flex: 3 1 55%;
     text-align: right;
+    padding-right: 0.4em;
 }
 
 nav ul {
@@ -203,34 +216,32 @@ nav ul {
     padding: 0;
 }
 
-/*nav li {
-    display: inline;
-}*/
-
 nav li a {
     display: inline-block;
     padding: 15px 20px;
-    transition-property: background-color;
-    transition-duration: 0.5s;
-    transition-delay: 0.1s;
     font-family: 'B612 Mono', monospace;
     font-weight: bold;
-    font-size: 0.9em;
 }
 
 nav li a:link, nav li a:visited {
     color: var(--ternary-link);
 }
 
+nav li a:hover, nav li a:active {
+    color: var(--ternary-link-hover);
+}
+
 main {
     flex: 1;
     display: flex;
     background-color: var(--content-bg);
     padding: 0 150px;
     flex-flow: row wrap;
-    /* gap: 20px; */
     z-index: 1;
-    /* margin: 0 0.1rem; */
+}
+
+main li {
+    padding: 0.2em 0;
 }
 
 .sidebar {
@@ -261,7 +272,11 @@ article time {
 }
 
 article a.title {
-    color: var(--yellow);
+    color: var(--primary-link);
+}
+
+article a.title:hover, article a.title:active {
+    color: var(--primary-link-hover);
 }
 
 code {
@@ -318,45 +333,31 @@ footer {
 
 #links-main li {
     padding: 7px 0;
+    list-style-type: none;
+}
+
+.links-column details {
+    border: 1px dotted var(--pewter-blue);
+    padding: 0.5em 0.5em 0;
+}
+
+.links-column details[open] {
+    padding: 0.5em;
+}
+
+.links-column details[open] summary {
+    border-bottom: 1px dotted var(--pewter-blue);
+    margin-bottom: 0.5em;
+}
+
+.links-column summary {
+    margin: -0.5em -0.5em 0;
+    padding: 0.5em;
 }
 
 .links-column {
     flex: 1 1 300px;
     overflow-wrap: break-word;
-    height: fit-content;
-}
-
-.hover-links {
-    position: relative;
-    border-bottom: 1px dotted var(--secondary-link);
-}
-
-a.hover-links:hover {
-    text-decoration: none;
-}
-
-.hover-links:before {
-    content: attr(data-hover);
-    visibility: hidden;
-    opacity: 0;
-    max-width: 340px;
-    min-width: 200px;
-    background-color: var(--main-bg);
-    color: var(--primary-text);
-    text-align: center;
-    border: 4px double var(--primary-text);
-    border-radius: 5px;
-    padding: 5px;
-    transition: opacity 0.3s ease-in-out;
-    position: absolute;
-    z-index: 1;
-    left: -50px;
-    top: -250%;
-}
-
-.hover-links:hover:before {
-    opacity: 0.8;
-    visibility: visible;
 }
 
 @media only screen and (max-width: 500px) {

themes/saturn/static/js/webmention.js

@@ -392,7 +392,7 @@ A more detailed example:
     let apiURL = `https://webmention.io/api/mentions.jf2?per-page=${maxWebmentions}&sort-by=${sortBy}&sort-dir=${sortDir}`;
 
     pages.forEach(function (path) {
-      apiURL += `&target[]=${encodeURIComponent('http:' + path)}&target[]=${encodeURIComponent('https:' + path)}`;
+      apiURL += `&target[]=${encodeURIComponent('http:' + path)}&target[]=${encodeURIComponent('https:' + path)}&target[]=${encodeURIComponent('https:' + path.endswith('/') ? path.slice(0, -1) : str)}`;
     });
 
     /** @type {WebmentionResponse} */