make download link more obvious but hide it for tiny images
This commit is contained in:
parent
9a54cc0d53
commit
ed88f03bab
2 changed files with 8 additions and 4 deletions
|
@ -51,6 +51,7 @@ make' root prefix nsfw dataDir dir info@(Info {date, title, artist, bg}) = do
|
||||||
= head images
|
= head images
|
||||||
let download0 = fromMaybe path0 download0'
|
let download0 = fromMaybe path0 download0'
|
||||||
let path0' = pageFile path0
|
let path0' = pageFile path0
|
||||||
|
let tinyCls = if any (tiny . #second) images then [b| class=tiny|] else ""
|
||||||
|
|
||||||
let descSection = makeDesc $ descFor nsfw info
|
let descSection = makeDesc $ descFor nsfw info
|
||||||
let tagsList = makeTags undir $ tagsFor nsfw info
|
let tagsList = makeTags undir $ tagsFor nsfw info
|
||||||
|
@ -126,7 +127,7 @@ make' root prefix nsfw dataDir dir info@(Info {date, title, artist, bg}) = do
|
||||||
$2.buttonBar
|
$2.buttonBar
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<figure id=mainfig data-width=$width0 data-height=$height0>
|
<figure id=mainfig data-width=$width0 data-height=$height0$tinyCls>
|
||||||
$warning'
|
$warning'
|
||||||
<a id=mainlink href="$download0" title="download full version">
|
<a id=mainlink href="$download0" title="download full version">
|
||||||
<img id=mainimg src="$path0'" alt="">
|
<img id=mainimg src="$path0'" alt="">
|
||||||
|
@ -261,6 +262,9 @@ makeUpdate (Update {date, desc}) = [b|@8
|
||||||
|
|
||||||
data Size = Size {width, height :: !Int} deriving (Eq, Show)
|
data Size = Size {width, height :: !Int} deriving (Eq, Show)
|
||||||
|
|
||||||
|
tiny :: Size -> Bool
|
||||||
|
tiny (Size {width, height}) = width < 250 || height < 250
|
||||||
|
|
||||||
imageSize :: FilePath -> FilePath -> IO Size
|
imageSize :: FilePath -> FilePath -> IO Size
|
||||||
imageSize dir img = do
|
imageSize dir img = do
|
||||||
-- "[0]" to get the first frame of an animation
|
-- "[0]" to get the first frame of an animation
|
||||||
|
|
|
@ -22,15 +22,15 @@
|
||||||
background: hsl(340, 45%, 65%);
|
background: hsl(340, 45%, 65%);
|
||||||
}
|
}
|
||||||
|
|
||||||
#mainfig::after {
|
#mainfig:not(.tiny)::after {
|
||||||
content: attr(data-width) ' × ' attr(data-height);
|
content: 'click for full (' attr(data-width) ' × ' attr(data-height) ')';
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: calc(0px - var(--border-thickness));
|
top: calc(0px - var(--border-thickness));
|
||||||
right: calc(0px - var(--border-thickness));
|
right: calc(0px - var(--border-thickness));
|
||||||
padding: 0.15em 1.25em 0.15em 0.75em;
|
padding: 0.15em 1.25em 0.15em 0.75em;
|
||||||
|
|
||||||
font-size: 60%;
|
font-size: 70%;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
|
|
||||||
background: hsl(0, 0%, 0%, 50%);
|
background: hsl(0, 0%, 0%, 50%);
|
||||||
|
|
Loading…
Reference in a new issue