homepage & gallery tweaks

4 files changed, 47 insertions, 21 deletions

diff --git a/src/misc-templates.js b/src/misc-templates.js
index 53a9605..253d5b4 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 c592efa..703c78f 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 29caa50..d699f24 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 c86d63c..9bf4a5b 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',
         ],
       },
       [