diff options
| author | BigCoke233 <hi@guhub.cn> | 2025-12-02 16:54:13 +0800 |
|---|---|---|
| committer | BigCoke233 <hi@guhub.cn> | 2025-12-02 16:54:13 +0800 |
| commit | 71056d1c8ee529ffa6066a17cc523eb1333c6089 (patch) | |
| tree | 2d388e0fb28af8862d6809c193ece319a19a4275 | |
| parent | d0f3c42b1f90cb692694aed85e4e12a716cdf115 (diff) | |
feat(ui/ux): the whole now-read-this component is clickable before, user must
click on the linked title, which can be confusing because the text is quite
small and other elements takes more space.
Former-commit-id: 50e729038ab7178ff00f4fca5260eab08a6e0c44
| -rw-r--r-- | layouts/_partials/posts/now-read-this.html | 18 |
1 files changed, 11 insertions, 7 deletions
diff --git a/layouts/_partials/posts/now-read-this.html b/layouts/_partials/posts/now-read-this.html index ab2d79b8..927e4d6f 100644 --- a/layouts/_partials/posts/now-read-this.html +++ b/layouts/_partials/posts/now-read-this.html @@ -1,19 +1,23 @@ {{ with site.RegularPages.Related . | first 1 }} -<div class="mt-8 pb-8 relative leading-loose"> - <h4 class="absolute -z-1 bottom-0 right-0 text-8 m-0 opacity-25 font-italic">{{ T "nowReadThis" }}</h4> - {{ range . }} +{{ range . }} +<a class="-mx-4 mt-8 p-4 pb-7 relative leading-loose block rounded-xl + hover:no-underline hover:bg-neutral-200/25 transition-colors" + href="{{ .RelPermalink }}"> + <h4 class="absolute -z-1 bottom-0 right-4 text-8 m-0 opacity-20 font-italic"> + {{ T "nowReadThis" }} + </h4> <div class="flex justify-between"> - <a class="font-800" href="{{ .RelPermalink }}"> + <span class="font-800 text-lg"> {{ .LinkTitle }} {{ with .Params.subtitle }} <span class="text-secondary font-normal">：{{ . }}</span> {{ end }} - </a> + </span> <span class="text-secondary">⏱️ {{ .ReadingTime }}min </span> </div> <div class="font-light"> <p>{{ .Summary | plainify }}</p> </div> - {{ end }} -</div> +</a> +{{ end }} {{ end }} |