Mercurial

diff mrjunejune/src/index.html @ 256:30c2196d03d4

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[site] Integrate Zenbu themes and components Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Tue, 04 Aug 2026 16:49:01 -0700
parents 40fa2363fee1
children 60a876c4587a
line wrap: on
line diff
--- a/mrjunejune/src/index.html	Tue Aug 04 15:12:18 2026 -0700
+++ b/mrjunejune/src/index.html	Tue Aug 04 16:49:01 2026 -0700
@@ -64,6 +64,28 @@
         z-index: 101;
         cursor: pointer;
       }
+
+      .site-link-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
+        gap: var(--zen-space-4);
+      }
+
+      .site-link-grid > a {
+        color: inherit;
+        text-decoration: none;
+      }
+
+      .site-link-grid zen-card,
+      .site-link-grid article {
+        height: 100%;
+      }
+
+      .site-link-grid p {
+        margin: 0;
+        color: var(--zen-color-text-muted);
+        font-size: 0.9rem;
+      }
     </style>
   </head>
   <body>
@@ -80,12 +102,28 @@
        </div>
 
        <h2>Links</h2>
-       <ul>
-         <li><a href="https://zenbu.babocoder.com/file/tip">Repository</a> - Check out my code</li>
-         <li><a href="/blog">Blogs</a> - My thoughts / Experiments </li>
-         <li><a href="/resume">Resume</a> - My professional experiences </li>
-         <li><a href="/tools">Tools</a> - Things I made for myself </li>
-       </ul> 
+       <div class="site-link-grid">
+         <a href="https://zenbu.babocoder.com/file/tip">
+           <zen-card interactive>
+             <article><h3>Repository</h3><p>Browse the code behind these experiments.</p></article>
+           </zen-card>
+         </a>
+         <a href="/blog">
+           <zen-card interactive>
+             <article><h3>Blogs</h3><p>Thoughts, experiments, and technical notes.</p></article>
+           </zen-card>
+         </a>
+         <a href="/resume">
+           <zen-card interactive>
+             <article><h3>Resume</h3><p>Professional experience and selected work.</p></article>
+           </zen-card>
+         </a>
+         <a href="/tools">
+           <zen-card interactive>
+             <article><h3>Tools</h3><p>Small things I built for myself.</p></article>
+           </zen-card>
+         </a>
+       </div>
        <canvas id="background"></canvas>
        <canvas id="game"></canvas>
        <canvas id="gameUI"></canvas>