add .corner and .left/.right classes

This commit is contained in:
Rhiannon Morris 2020-07-19 18:03:24 +02:00
parent c2f991bc3e
commit 0f908581df
3 changed files with 15 additions and 11 deletions

View file

@ -40,7 +40,7 @@ make' nsfw (Info {date, title, artist, tags, nsfwTags,
<header> <header>
<h1>$*title</h1> <h1>$*title</h1>
$artistTag $artistTag
<h2 class=date>$formattedDate</h2> <h2 id=date class="right corner">$formattedDate</h2>
$buttonBar $buttonBar
</header> </header>
@ -92,7 +92,7 @@ make' nsfw (Info {date, title, artist, tags, nsfwTags,
makeArtist :: Artist -> Builder makeArtist :: Artist -> Builder
makeArtist (Artist {name, url}) = makeArtist (Artist {name, url}) =
[b|<h2 class=artist>by $artistLink</h2>|] [b|<h2 id=artist class="left corner">by $artistLink</h2>|]
where where
artistLink = case url of artistLink = case url of
Just u -> [b|<a href="$*u">$*name</a>|] Just u -> [b|<a href="$*u">$*name</a>|]

View file

@ -48,6 +48,18 @@ body {
background: var(--lighter-tum); background: var(--lighter-tum);
} }
.corner {
font-weight: 400;
position: absolute;
top: -0.5em;
margin: 0;
padding: 0;
font-size: 100%;
}
.left.corner { left: -0.4em; }
.right.corner { right: -0.4em; }
b { font-weight: 600; } b { font-weight: 600; }
b b { font-weight: 900; } b b { font-weight: 900; }

View file

@ -5,17 +5,9 @@ body {
position: relative; position: relative;
} }
.date, .artist { #date, #artist {
font-weight: 400;
position: absolute;
top: -0.5em;
margin: 0;
padding: 0;
font-size: 100%;
font-style: italic; font-style: italic;
} }
.date { right: -0.4em; }
.artist { left: -0.4em; }
#mainfig { #mainfig {
justify-content: center; justify-content: center;