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.
This commit is contained in:
undergoundwires 2022-11-16 01:14:33 +01:00
parent 345c1cb020
commit 94b6795a52
2 changed files with 2 additions and 2 deletions

View file

@ -67,7 +67,7 @@
&-item {
border-bottom: 1px grey dashed;
a {
&-inner {
display: flex;
justify-content: space-between;
align-items: baseline;

View file

@ -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 }}