users/foo-dogsquared: update custom homepage grid layout

configs/home-manager/foo-dogsquared/files/homepage/assets/scss/main.scss

@@ -14,24 +14,12 @@ body {
 }
 
 #links {
-  --width: 40ch;
+  --width: 30ch;
   display: grid;
-  grid-auto-flow: column;
-  grid-auto-columns: var(--width);
   grid-template-columns: repeat(auto-fill, minmax(var(--width), 1fr));
+  grid-template-rows: max-content;
   gap: 0.5em;
 
-  // Place it at the very center.
-  position: absolute;
-  top: 30%;
-  margin-top: calc(var(--width) / 2);
-  margin-left: calc(0 - var(--width));
-
-  height: auto;
-  margin: 0 auto;
-
-  overflow-x: scroll;
-
   section[id^="section-"] {
     background: var(--foreground);
     color: var(--background);

configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/links.toml

@@ -10,6 +10,7 @@ links = [
   { url = "https://login.tailscale.com", text = "Tailscale" },
   { url = "https://devdocs.io", text = "Devdocs" },
 ]
+grid.row = 2
 
 [applications]
 name = "Applications"
@@ -35,6 +36,7 @@ links = [
   { url = "https://cloud.oracle.com", text = "Oracle Cloud" },
   { url = "https://cloud.hetzner.com", text = "Hetzner Cloud" },
 ]
+grid.row = 2
 
 [design]
 name = "Design"

configs/home-manager/foo-dogsquared/files/homepage/layouts/index.html

@@ -9,7 +9,13 @@
     <div id="links">
         {{ range $key, $value := sort (index $.Site.Data (slice "foodogsquared-homepage" "links")) "weight" }}
             {{- $name := default $key $value.name -}}
-            <section id="section-{{ $name }}">
+            <section
+                id="section-{{ $name }}"
+                tabindex="1"
+                {{ with $value.grid }}
+                style="{{ with .column }}grid-column: span {{ . }};{{ end }}{{ with .row }}grid-row: span {{ . }};{{ end }}"
+                {{ end }}
+            >
                 <span class="nav-header">{{ $name }}</span>
                 {{ with $value.flavorText }}
                     <span class="flavor-text">{{ . }}</span>

configs/home-manager/foo-dogsquared/files/homepage/package.nix

@@ -5,7 +5,7 @@
 
 buildHugoSite {
   pname = "foodogsquared-hm-startpage";
-  version = "0.1.0";
+  version = "0.2.0";
   src = lib.cleanSource ./.;
 
   vendorHash = "sha256-Mi61QK1yKWIneZ+i79fpJqP9ew5r5vnv7ptr9YGq0Uk=";