Show heading anchor on touch devices

This commit is contained in:
Cotes Chung 2021-12-09 20:45:20 +08:00
parent df81012e28
commit d919f833f1
2 changed files with 15 additions and 10 deletions

View file

@ -62,7 +62,7 @@ h2 {
h3 { h3 {
@extend %heading; @extend %heading;
@extend %section; @extend %section;
@extend %anchor-relative; @extend %anchor;
font-size: 1.2rem; font-size: 1.2rem;
} }

View file

@ -19,19 +19,24 @@
%anchor { %anchor {
> a { > a {
font-size: 70%; font-size: 1rem;
visibility: hidden;
margin-left: 0.5rem; margin-left: 0.5rem;
border-bottom: none !important;
opacity: 0;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;
} }
&:hover { @media (hover: hover) {
> a { > a {
visibility: visible; border-bottom: none !important;
opacity: 1; visibility: hidden;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0s; opacity: 0;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;
}
&:hover {
> a {
visibility: visible;
opacity: 1;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;
}
} }
} }
} }