konstantin/iamkonstantin
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages 1 Wiki Activity

Heaadings have a # on hover are actually links

Browse source
This commit is contained in:
Konstantin 2024-08-24 12:01:00 +02:00
parent d03ff36185
commit 9073718616
2 changed files with 15 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

6
base/templates/base/blocks/heading_block.html
View file

@ -1,7 +1,7 @@
{% if self.size == 'h2' %} {% if self.size == 'h2' %}
<h2 id="{{ self.heading_text|lower|slugify }}">{{ self.heading_text }}</h2> <h2 id="{{ self.heading_text|lower|slugify }}"><a href="#{{ self.heading_text|lower|slugify }}" class="border-0 hover:border-b-4">{{ self.heading_text }}</a></h2>
{% elif self.size == 'h3' %} {% elif self.size == 'h3' %}
<h3 id="{{ self.heading_text|lower|slugify }}">{{ self.heading_text }}</h3> <h3 id="{{ self.heading_text|lower|slugify }}"><a href="#{{ self.heading_text|lower|slugify }}" class="border-0 hover:border-b-4">{{ self.heading_text }}</a></h3>
{% elif self.size == 'h4' %} {% elif self.size == 'h4' %}
<h4 id="{{ self.heading_text|lower|slugify }}">{{ self.heading_text }}</h4> <h4 id="{{ self.heading_text|lower|slugify }}"><a href="#{{ self.heading_text|lower|slugify }}" class="border-0 hover:border-b-4">{{ self.heading_text }}</a></h4>
{% endif %} {% endif %}

12
theme/static_src/src/styles.css
View file

@ -24,6 +24,18 @@
@apply border-klavender border-b-4; @apply border-klavender border-b-4;
} }
a[href^="#"]::before {
@apply hover:visible;
content: "#";
display: inline-block;
font-size: 0.9em;
line-height: 1;
margin-left: -0.8em;
text-decoration: none;
visibility: hidden;
width: 0.8em;
}
h1 { h1 {
@apply mt-8 mb-6 text-2xl sm:text-4xl lg:text-4xl leading-none font-extrabold tracking-tight text-black dark:text-white; @apply mt-8 mb-6 text-2xl sm:text-4xl lg:text-4xl leading-none font-extrabold tracking-tight text-black dark:text-white;
} }