chore: styles

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "coryd.dev",
-  "version": "24.15.2",
+  "version": "24.16.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "coryd.dev",
-      "version": "24.15.2",
+      "version": "24.16.1",
       "license": "MIT",
       "dependencies": {
         "@cdransf/api-text": "^1.5.0",
@@ -1744,9 +1744,9 @@
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.24",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.24.tgz",
-      "integrity": "sha512-0x0wLCmpdKFCi9ulhvYZebgcPmHTkFVUfU2wzDykadkslKwT4oAmDTHEKLnlrDsMGZe4B+ksn8quZfZjYsBetA==",
+      "version": "1.5.25",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.25.tgz",
+      "integrity": "sha512-kMb204zvK3PsSlgvvwzI3wBIcAw15tRkYk+NQdsjdDtcQWTp2RABbMQ9rUBy8KNEOM+/E6ep+XC3AykiWZld4g==",
       "dev": true,
       "license": "ISC"
     },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "24.16.0",
+  "version": "24.16.1",
   "description": "The source for my personal site. Built using 11ty (and other tools).",
   "type": "module",
   "scripts": {

src/assets/styles/base/index.css

@@ -48,6 +48,7 @@ body::-webkit-scrollbar {
 
 p {
   margin: var(--margin-vertical-base-horizontal-zero);
+  overflow: visible;
 
   &.books,
   &.collected,
@@ -173,18 +174,13 @@ a {
 
 a:focus,
 a:focus-within
-a:focus > svg,
-a:focus-within > svg {
+a:has(svg):focus svg,
+a:has(svg):focus-within svg {
   outline: var(--outline-default);
   border-radius: var(--border-radius-slight);
   text-decoration: none;
 }
 
-a:has(svg):focus,
-a:has(svg):focus-within {
-  outline: none;
-}
-
 a.icon-link:focus,
 a.icon-link:focus-within {
   outline: var(--outline-default);

src/assets/styles/components/music-chart.css

@@ -39,6 +39,16 @@
       }
     }
 
+    & a:has(img) {
+      display: flex;
+    }
+
+    & a:focus img,
+    & a:focus-within img {
+      outline: var(----outline-default);
+      border: 0;
+    }
+
     & img {
       border: var(--border-default);
       border-radius: var(--border-radius-slight);

src/assets/styles/pages/books.css

@@ -51,10 +51,6 @@
 
     & p {
       margin: 0;
-      overflow: hidden;
-      max-width: 100%;
-      text-overflow: ellipsis;
-      width: fit-content;
     }
 
     & .description {
@@ -87,25 +83,23 @@
     flex-direction: column;
     gap: var(--spacing-sm);
 
-    & p {
-      &.title {
-        font-size: var(--font-size-xl);
-        line-height: var(--line-height-md);
-      }
+    & p.title {
+      font-size: var(--font-size-xl);
+      line-height: var(--line-height-md);
+    }
 
-      &.sub-meta {
-        font-size: var(--font-size-sm);
+    & p.sub-meta {
+      font-size: var(--font-size-sm);
 
-        & svg {
-          width: var(--sizing-svg-sm);
-          height: var(--sizing-svg-sm);
-        }
+      & svg {
+        width: var(--sizing-svg-sm);
+        height: var(--sizing-svg-sm);
       }
+    }
 
-      &.title,
-      &.sub-meta {
-        margin: 0;
-      }
+    & p.title,
+    & p.sub-meta {
+      margin: 0;
     }
   }
 }

src/includes/partials/media/music/recent.liquid

@@ -3,19 +3,21 @@
   {%- capture alt -%}{{ item.title | escape }} by {{ item.artist }}{%- endcapture -%}
     <div class="item">
       <div class="meta">
-        <img
-          srcset="
-            https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp 50w,
-            https://cdn.coryd.dev{{ item.image }}?class=w100&type=webp 100w
-          "
-          sizes="(max-width: 450px) 50px, 100px"
-          src="https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp"
-          alt="{{ alt }}"
-          loading="lazy"
-          decoding="async"
-          width="64"
-          height="64"
-        />
+        <a href="{{ item.url }}">
+          <img
+            srcset="
+              https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp 50w,
+              https://cdn.coryd.dev{{ item.image }}?class=w100&type=webp 100w
+            "
+            sizes="(max-width: 450px) 50px, 100px"
+            src="https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp"
+            alt="{{ alt }}"
+            loading="lazy"
+            decoding="async"
+            width="64"
+            height="64"
+          />
+        </a>
         <div class="meta-text">
           <div class="title">
             <a href="{{ item.url }}">{{ item.title }}</a>

src/pages/dynamic/posts/index.html

@@ -11,9 +11,9 @@ permalink: "/posts/{% if pagination.pageNumber > 0 %}{{ pagination.pageNumber }}
   {% for post in pagination.items %}
   <article>
     <time datetime="{{ post.date }}">{{ post.date | date: "%B %e, %Y" }}</time>
-    <a href="{{ post.slug }}">
-      <h3>{{ post.title }}</h3>
-    </a>
+    <h3>
+      <a href="{{ post.slug }}">{{ post.title }}</a>
+    </h3>
     <p>{{ post.description }}</p>
   </article>
   {% endfor %}