summaryrefslogtreecommitdiffstatshomepage
diff options
context:
space:
mode:
authorWolfgang Müller2022-11-04 20:59:17 +0100
committerWolfgang Müller2022-11-04 20:59:17 +0100
commitdd2910445e55ba587bd0b5ff9b7296997a074453 (patch)
tree47a4c5fef08a5ef6b8733c07934c86d713770154
parent2666c5768042bd0c7de7b774d82c6bd7bd02b9fb (diff)
downloadzunzuncito-dd2910445e55ba587bd0b5ff9b7296997a074453.tar.gz
Have the post title contain a permalink
The use of the section sign § as a permalink marker has been bugging us for a while now. Whilst being fairly well highlighted it is very hard to click on account of being so small. Some other sites usually "hide" the permalink behind the date, but that feels very counterintuitive to us. Instead, use the most prominent feature of the banner, the title. Make sure to underline it so that people know it's clickable. Whilst we're there, also remove the special handling for related posts (no need anymore now to reveal the post number on the page). Since we were using the 'bold-hover' class in this particular element only, also remove it.
-rw-r--r--sass/style.sass7
-rw-r--r--templates/macros.html3
2 files changed, 4 insertions, 6 deletions
diff --git a/sass/style.sass b/sass/style.sass
index 1553227..dfb837c 100644
--- a/sass/style.sass
+++ b/sass/style.sass
@@ -52,10 +52,6 @@ a.tag
&::before
content: "#"
-a.bold-hover:hover
- text-decoration: none
- text-shadow: 0px 0px 1px var(--fg-href)
-
h3.related
margin: 0
@@ -70,6 +66,9 @@ h2.title
&::before
@include spacer
+ a
+ color: inherit
+
pre
border: 1px solid var(--border-color-light)
box-shadow: 0px 0px 2px var(--border-color-light)
diff --git a/templates/macros.html b/templates/macros.html
index dc621f9..f504f76 100644
--- a/templates/macros.html
+++ b/templates/macros.html
@@ -4,9 +4,8 @@
<img class="avatar" alt="{{ config.extra.author }}" src="{{ config.extra.avatar }}" width="64" />
<div class="banner smaller">
<div class="info">
- <a class="bold-hover" title="permalink to this post" href="{{ post.permalink }}">{% if class == "related" %}№ {{ post.slug }} {% else %}§{% endif %}</a>
<time class="mute" datetime="{{ post.date }}" title="{{ post.date }}">{{ post.date | date(format="%F") }}</time>
- <h2 class="mute title">{{ post.title }}</h2>
+ <h2 class="mute title"><a title="permalink to this post" href="{{ post.permalink }}">{{ post.title }}</a></h2>
</div>
{%- if "tags" in post.taxonomies %}
<nav class="tags">