diff options
| author | Wolfgang Müller | 2022-11-04 20:59:17 +0100 |
|---|---|---|
| committer | Wolfgang Müller | 2022-11-04 20:59:17 +0100 |
| commit | dd2910445e55ba587bd0b5ff9b7296997a074453 (patch) | |
| tree | 47a4c5fef08a5ef6b8733c07934c86d713770154 | |
| parent | 2666c5768042bd0c7de7b774d82c6bd7bd02b9fb (diff) | |
| download | zunzuncito-trunk.tar.gz | |
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.sass | 7 | ||||
| -rw-r--r-- | templates/macros.html | 3 |
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"> |