daniel/hugo_bootstrap_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add resource-tiles shortcode

Browse Source 
Displays a page's file resources as a responsive grid of cards with a
thumbnail (explicit param, name-matched image, or a generic file icon),
title, size and download link. Meant for a downloads page offering a
handful of PDFs.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
daniel
2026-09-02 21:24:38 +02:00
co-authored by Claude Sonnet 5
parent 071ee344a3
commit 13fb67a0f8
3 changed files with 191 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/scss/hugo_bootstrap_theme.scss
+33
View File
@@ -87,3 +87,36 @@ h1, h2, h3, h4, h5 {
margin-top: -3rem;
}
// Resource tiles (see the `resource-tiles` shortcode): a grid of cards,
// one per downloadable file, each with a thumbnail or a generic file
// icon on top.
.resource-tile {
&__thumb,
&__icon {
aspect-ratio: 3 / 2;
width: 100%;
object-fit: cover;
background-color: var(--bs-light);
}
&__icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
color: var(--bs-primary);
}
&__ext {
position: absolute;
bottom: 0.9rem;
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
}
.card-title {
margin-bottom: 0.25rem;
}
}