From 7b0f1ceb07a1219f20f6819ed57e5f47a51d15b1 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Wed, 28 Dec 2022 17:02:22 -0400 Subject: homepage & gallery tweaks --- src/misc-templates.js | 2 +- src/page/homepage.js | 9 ++++----- src/static/site2.css | 50 ++++++++++++++++++++++++++++++++++++-------------- src/upd8.js | 7 ++++++- 4 files changed, 47 insertions(+), 21 deletions(-) diff --git a/src/misc-templates.js b/src/misc-templates.js index 53a96059..253d5b47 100644 --- a/src/misc-templates.js +++ b/src/misc-templates.js @@ -586,7 +586,7 @@ function unbound_getGridHTML({ img({ src: srcFn(item), alt: altFn(item), - thumb: 'small', + thumb: 'medium', lazy: typeof lazy === 'number' ? i >= lazy : lazy, square: true, reveal: getRevealStringFromTags(item.artTags, {language}), diff --git a/src/page/homepage.js b/src/page/homepage.js index c592efa6..703c78fc 100644 --- a/src/page/homepage.js +++ b/src/page/homepage.js @@ -123,11 +123,10 @@ export function writeTargetless({wikiData}) { }), entry.actionLinks.length && - html.tag('div', {class: 'grid-listing'}, - html.tag('div', {class: 'grid-actions'}, - transformActionLinks(entry.actionLinks, { - transformInline, - }))), + html.tag('div', {class: 'grid-actions'}, + transformActionLinks(entry.actionLinks, { + transformInline, + })), ]), ]))), ]), diff --git a/src/static/site2.css b/src/static/site2.css index 29caa50b..d699f243 100644 --- a/src/static/site2.css +++ b/src/static/site2.css @@ -233,6 +233,30 @@ body::before { position: relative; z-index: 2; } + + .layout-columns.has-one-sidebar .grid-listing { + grid-template-columns: repeat(12, 1fr); + } + + .layout-columns.has-one-sidebar .grid-listing > .grid-item:not(:nth-child(n+7)) { + grid-column: span 4; + } + + .layout-columns.has-one-sidebar .grid-listing > .grid-item:nth-child(n+7) { + grid-column: span 3; + } + + .layout-columns.has-zero-sidebars .grid-listing { + grid-template-columns: repeat(20, 1fr); + } + + .layout-columns.has-zero-sidebars .grid-listing > .grid-item:not(:nth-child(n+9)) { + grid-column: span 5; + } + + .layout-columns.has-zero-sidebars .grid-listing > .grid-item:nth-child(n+9) { + grid-column: span 4; + } } /* Layout - Medium or Thin */ @@ -872,15 +896,24 @@ img { /* Grid listings */ .grid-listing { + /* display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; + */ + + display: grid; + padding: 15px; + grid-gap: 30px; +} + +.grid-item { + font-size: 0.9em; } .grid-item { display: inline-block; - margin: 15px; text-align: center; background-color: #111111; border: 1px dotted var(--primary-color); @@ -929,6 +962,7 @@ img { } .grid-actions { + grid-column: span 12; display: flex; flex-direction: row; margin: 15px; @@ -940,23 +974,11 @@ img { .grid-actions > .grid-item { flex-basis: unset !important; margin: 5px; + width: 120px; --primary-color: inherit !important; --dim-color: inherit !important; } -.grid-item { - flex-basis: 240px; - min-width: 200px; - max-width: 240px; -} - -.grid-item:not(.large-grid-item) { - flex-basis: 180px; - min-width: 120px; - max-width: 180px; - font-size: 0.9em; -} - /* Montage */ .montage-container { diff --git a/src/upd8.js b/src/upd8.js index c86d63cd..9bf4a5b8 100755 --- a/src/upd8.js +++ b/src/upd8.js @@ -147,7 +147,7 @@ import FileSizePreloader from './file-size-preloader.js'; const __dirname = path.dirname(fileURLToPath(import.meta.url)); -const CACHEBUST = 14; +const CACHEBUST = 15; let COMMIT; try { @@ -1166,6 +1166,11 @@ export function generateDocumentHTML(pageInfo, { class: [ 'layout-columns', !collapseSidebars && 'vertical-when-thin', + (sidebarLeftHTML || sidebarRightHTML) && 'has-one-sidebar', + (sidebarLeftHTML && sidebarRightHTML) && 'has-two-sidebars', + !(sidebarLeftHTML || sidebarRightHTML) && 'has-zero-sidebars', + sidebarLeftHTML && 'has-sidebar-left', + sidebarRightHTML && 'has-sidebar-right', ], }, [ -- cgit 1.3.0-6-gf8a5