hak8or/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Display posts count for each tag in the tag list

Browse Source 
And increase the "small" for size to closest pixel-perfect value
This commit is contained in:
daudix
2024-06-18 05:44:13 +03:00
parent 276a3a37ea
commit bcf57b7147
5 changed files with 35 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
sass/_comments.scss
View File

@ -87,7 +87,7 @@ section#comments {
background-color: var(--fg-muted-1); background-color: var(--fg-muted-1);
padding: 0.25rem 0.75rem; padding: 0.25rem 0.75rem;
color: var(--fg-color); color: var(--fg-color);
font-size: 0.8rem; font-size: 0.875rem;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
@ -128,7 +128,7 @@ section#comments {
time { time {
grid-area: time; grid-area: time;
color: var(--fg-muted-5); color: var(--fg-muted-5);
font-size: 0.8rem; font-size: 0.875rem;
} }
main { main {

2
sass/_footer.scss
View File

@ -104,6 +104,6 @@
all: unset; all: unset;
margin: 0 auto; margin: 0 auto;
color: var(--fg-muted-5); color: var(--fg-muted-5);
font-size: 0.8rem; font-size: 0.875rem;
} }
} }

28
sass/_tags.scss
View File

@ -15,24 +15,48 @@
} }
} }
.tag { a {
transition: var(--transition); transition: var(--transition);
box-shadow: var(--edge-highlight); box-shadow: var(--edge-highlight);
border-radius: 999px; border-radius: 999px;
background-color: var(--fg-muted-1); background-color: var(--fg-muted-1);
padding: 0.25rem 0.75rem; padding: 0.25rem 0.75rem;
color: var(--fg-color); color: var(--fg-color);
font-size: 0.8rem; font-size: 0.875rem;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
background-color: var(--primary-color-alpha); background-color: var(--primary-color-alpha);
color: var(--primary-color); color: var(--primary-color);
text-decoration: none; text-decoration: none;
.count {
background-color: var(--primary-color-alpha);
color: var(--primary-color);
} }
}
&:has(.tag) {
padding: 0;
}
.tag {
display: inline-block;
padding: 0.25rem 0.5rem 0.25rem 0.75rem;
&::before { &::before {
content: "#"; content: "#";
} }
} }
.count {
display: inline-block;
transition: var(--transition);
border-radius: 0 999px 999px 0;
background-color: var(--fg-muted-1);
padding: 0.25rem 0.625rem 0.25rem 0.5rem;
color: var(--fg-muted-4);
font-variant-numeric: tabular-nums;
}
}
} }

6
sass/_typography.scss
View File

@ -27,7 +27,7 @@ h3 {
small { small {
color: var(--fg-muted-5); color: var(--fg-muted-5);
font-size: 0.8rem; font-size: 0.875rem;
} }
abbr[title] { abbr[title] {
@ -38,7 +38,7 @@ abbr[title] {
figcaption { figcaption {
color: var(--fg-muted-4); color: var(--fg-muted-4);
font-size: 0.8rem; font-size: 0.875rem;
text-align: center; text-align: center;
} }
@ -71,7 +71,7 @@ kbd {
border-radius: var(--rounded-corner-small); border-radius: var(--rounded-corner-small);
background-color: var(--fg-muted-2); background-color: var(--fg-muted-2);
padding: 0.125rem 0.375rem; padding: 0.125rem 0.375rem;
font-size: 0.8rem; font-size: 0.875rem;
line-height: normal; line-height: normal;
// Small nice thingy, keys can be pressed! // Small nice thingy, keys can be pressed!

2
templates/taxonomy_list.html
View File

@ -6,7 +6,7 @@
<br /> <br />
<ul class="tags"> <ul class="tags">
{% for tag in terms %} {% for tag in terms %}
<li><a class="tag" href="{{ get_taxonomy_url(kind='tags', name=tag.name, lang=lang) }}">{{ tag.name }}</a></li> <li><a href="{{ get_taxonomy_url(kind='tags', name=tag.name, lang=lang) }}"><span class="tag">{{ tag.name }}</span><span class="count">{{ tag.pages | length }}</span></a></li>
{% endfor %} {% endfor %}
</ul> </ul>
{% endblock content %} {% endblock content %}