From 94b6795a522491133bd91567653faa6f9e150855 Mon Sep 17 00:00:00 2001
From: undergoundwires <git@undergroundwires.dev>
Date: Wed, 16 Nov 2022 01:14:33 +0100
Subject: [PATCH] Improve styling to allow flexible overrides

This commit changes targeted styling of `a` element to a class-based
styling. This way, this is style is reusable on other elements and
another `<a>` element can be used inside a `post-item`.

Otherwise, if someone would need to use `<a>` element in a post item,
then he would get all other styles (such as `display:flex`) on every
`<a>` which is unexpected.

This commit ensures that the style is abstracted from the element type
itself, giving more flexibility when overriding the theme, and increases
maintainability by making the intent more clear.
---
 assets/scss/_list.scss     | 2 +-
 layouts/_default/list.html | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/assets/scss/_list.scss b/assets/scss/_list.scss
index e431b37..05388ec 100644
--- a/assets/scss/_list.scss
+++ b/assets/scss/_list.scss
@@ -67,7 +67,7 @@
     &-item {
       border-bottom: 1px grey dashed;
 
-      a {
+      &-inner {
         display: flex;
         justify-content: space-between;
         align-items: baseline;
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index b440287..b8a5062 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -15,7 +15,7 @@
                 <ul class="posts-list">
                     {{ range .Pages }}
                         <li class="post-item">
-                            <a href="{{.Permalink}}">
+                            <a href="{{.Permalink}}" class="post-item-inner">
                                 <span class="post-title">{{.Title}}</span>
                                 <span class="post-day">
                                     {{ if .Site.Params.dateformShort }}