changed anchor to icon #123

This commit is contained in:
Dmitry Kolosov 2022-01-12 22:31:44 +03:00
parent 6372a927bc
commit 990799a86a
5 changed files with 63 additions and 22 deletions

View File

@ -25,3 +25,6 @@
--switcher-color: #333;
--switcher-bg-color: #fff;
--svg-color: #ccc;
--svg-state-color:#ff5858;

View File

@ -26,4 +26,7 @@
--switcher-color: #fff;
--switcher-bg-color: #333;
--svg-color: #333;
--svg-state-color: #a31d1d;
}

View File

@ -372,8 +372,7 @@ article header h1 a {
.post h6 a {
opacity: 0;
position: absolute;
left: -0.7em;
color: var(--font-color);
left: -1.2rem;
}
.post h1:hover a,
@ -383,27 +382,58 @@ article header h1 a {
.post h5:hover a,
.post h6:hover a {
opacity: 1;
border-bottom: none;
}
.post h1:hover a:hover,
.post h1:hover a:focus,
.post h1:hover a:active,
.post h2:hover a:hover,
.post h2:hover a:focus,
.post h2:hover a:active,
.post h3:hover a:hover,
.post h3:hover a:focus,
.post h3:hover a:active,
.post h4:hover a:hover,
.post h4:hover a:focus,
.post h4:hover a:active,
.post h5:hover a:hover,
.post h5:hover a:focus,
.post h5:hover a:active,
.post h6:hover a:hover,
.post h6:hover a:focus,
.post h6:hover a:active {
color: var(--link-state-color);
.post h1 a:hover,
.post h1 a:focus,
.post h1 a:active,
.post h2 a:hover,
.post h2 a:focus,
.post h2 a:active,
.post h3 a:hover,
.post h3 a:focus,
.post h3 a:active,
.post h4 a:hover,
.post h4 a:focus,
.post h4 a:active,
.post h5 a:hover,
.post h5 a:focus,
.post h5 a:active,
.post h6 a:hover,
.post h6 a:focus,
.post h6 a:active {
border-bottom: none;
}
.post h1 svg,
.post h2 svg,
.post h3 svg,
.post h4 svg,
.post h5 svg,
.post h6 svg {
stroke: var(--svg-color);
}
.post h1 svg:hover,
.post h1 svg:focus,
.post h1 svg:active,
.post h2 svg:hover,
.post h2 svg:focus,
.post h2 svg:active,
.post h3 svg:hover,
.post h3 svg:focus,
.post h3 svg:active,
.post h4 svg:hover,
.post h4 svg:focus,
.post h4 svg:active,
.post h5 svg:hover,
.post h5 svg:focus,
.post h5 svg:active,
.post h6 svg:hover,
.post h6 svg:focus,
.post h6 svg:active {
stroke: var(--svg-state-color);
}
.post-info {

1
assets/images/link.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" ?><svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" fill="none" stroke="#000" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" fill="none" stroke="#000" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2"/></svg>

After

Width:  |  Height:  |  Size: 432 B

View File

@ -1,3 +1,7 @@
<h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }}
<span><a href="#{{ .Anchor }}">#</a></span>
<span>
<a href="#{{ .Anchor }}">
<svg viewBox="0 0 28 23" height="100%" width="19 " xmlns="http://www.w3.org/2000/svg"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" fill="none" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" fill="none" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2"/></svg>
</a>
</span>
</h{{ .Level }}>