flupe
/
acatalepsie
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added grid for gallery

This commit is contained in:
flupe 2020-10-08 13:35:00 +02:00
parent 2eed97086f
commit 0f4d94eb28
2 changed files with 43 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
content/assets/theme.css
View File

@ -283,8 +283,18 @@ ol.pages li a {
padding: 0 1em;
}
section.visual {
display: grid;
grid-gap: 1em;
align-items: center;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
section.visual figure { margin: 0 }
figure img {
max-width: 100%;
height: auto;
/* aspect-ratio: attr(width) / attr(height); */
vertical-align: top;
}

56
src/Visual.hs
View File

@ -5,40 +5,50 @@ import Common
import Templates (outerWith, loading_)
import Lucid
thumbWidth :: Int
thumbWidth = 710
build :: Task IO ()
build = do
pictures <- match "visual/*" \src -> do
copyFile src
src' <- toAbsolute src
size <- (resized . read)
<$> readCommand "identify" ["-ping", "-format", "(%w, %h)", src']
processMagick src
<&> timestamped
<&> fmap (size,)
copyFile src
callCommandWith
(\a b -> "convert " <> a <> " " <> b)
(-<.> "webp")
src
src' <- toAbsolute src
size <- (resized . read)
<$> readCommand "identify" ["-ping", "-format", "(%w, %h)", src']
callCommandWith
(\a b -> "convert -resize 710x " <> a <> " " <> b)
(-<.> "thumb.webp")
src
<&> timestamped
<&> fmap (size,)
watch pictures $ match_ "./visual.rst" \src -> do
intro <- compilePandoc src
write "visual.html" $ renderVisual intro (recentFirst pictures)
resized :: (Int, Int) -> (Int, Int)
resized (width, height) = (710, round $ fi height * 710.0 / fi width)
where
fi :: Int -> Float
fi = fromIntegral
resized :: (Int, Int) -> (Int, Int)
resized (width, height) =
(thumbWidth, round $ fi height * fi thumbWidth / fi width)
where
fi :: Int -> Float
fi = fromIntegral
renderVisual :: Text -> [Timestamped ((Int, Int), FilePath)] -> Html ()
renderVisual txt imgs =
outerWith def {title = "visual"} do
toHtmlRaw txt
hr_ []
section_ $ forM_ imgs \ (Timestamped _ ((width, height), p)) ->
figure_ $ img_
[ src_ (fromString p)
, width_ (fromString $ show width)
, height_ (fromString $ show height)
, loading_ "lazy" ]
processMagick :: FilePath -> Task IO FilePath
processMagick = callCommandWith
(\a b -> "convert -resize 710x " <> a <> " " <> b)
(-<.> "thumb.webp")
section_ [class_ "visual"] $
forM_ imgs \ (Timestamped _ ((width, height), p)) ->
figure_ $ a_ [href_ (fromString (replaceExtensions p "webp"))] $ img_
[ src_ (fromString p)
, width_ (fromString $ show width)
, height_ (fromString $ show height)
, loading_ "lazy" ]