put index link titles as inline text for not (hover)

This commit is contained in:
Rhiannon Morris 2020-07-25 13:59:33 +02:00
parent 21bdb28c65
commit cdc6e5ddcf
2 changed files with 17 additions and 7 deletions

View file

@ -15,6 +15,7 @@
hsl(155deg, 57%, 62%) hsl(155deg, 57%, 62%)
); );
background: var(--gradient) fixed; background: var(--gradient) fixed;
margin: 1em;
--nsfw-sticker-rotate: 15deg; --nsfw-sticker-rotate: 15deg;
} }

View file

@ -33,14 +33,11 @@ header h1::after {
@media screen { @media screen {
.nsfw::after { .nsfw::after {
content: url(../18_plus_white.svg); content: url(../18_plus_white.svg);
display: inline-block; height: 1em;
height: 0.8em; width: 1em;
width: 0.8em;
transform: rotate(var(--nsfw-sticker-rotate)); transform: rotate(var(--nsfw-sticker-rotate));
vertical-align: top;
opacity: 80%;
mix-blend-mode: hard-light; mix-blend-mode: hard-light;
padding-left: 0.25em; margin-left: 0.3em;
} }
} }
@ -69,7 +66,7 @@ header h1::after {
margin: 0; margin: 0;
padding: 0; padding: 0;
grid-template-columns: 50% 50%; grid-template-columns: 50% 50%;
grid-gap: 1em 0; grid-gap: 1em 1.5em;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -79,6 +76,10 @@ header h1::after {
.list li { .list li {
list-style: none; list-style: none;
text-align: center; text-align: center;
display: grid;
grid-template-columns: auto min-content;
align-items: center;
justify-content: center;
} }
.list a { .list a {
@ -96,3 +97,11 @@ main {
grid-gap: 1em; grid-gap: 1em;
} }
} }
@media not (hover) {
.list a::after {
content: attr(title);
display: block;
font-size: 60%;
}
}