Mercurial

comparison mrjunejune/src/index.html @ 258:60a876c4587a

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[ui] Add semantic primitive ownership Build a layered Zenbu token and sizing system, make authored controls use native-underneath primitives, migrate mrjunejune without imposing visual surfaces, and document/enforce HTML ownership in the catalog and wiki. Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Wed, 05 Aug 2026 05:25:40 -0700
parents 30c2196d03d4
children 1f9877b637e9
comparison
equal deleted inserted replaced
257:609d3c6aff4e 258:60a876c4587a
63 pointer-events: auto; 63 pointer-events: auto;
64 z-index: 101; 64 z-index: 101;
65 cursor: pointer; 65 cursor: pointer;
66 } 66 }
67 67
68 .site-link-grid {
69 display: grid;
70 grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
71 gap: var(--zen-space-4);
72 }
73
74 .site-link-grid > a {
75 color: inherit;
76 text-decoration: none;
77 }
78
79 .site-link-grid zen-card,
80 .site-link-grid article {
81 height: 100%;
82 }
83
84 .site-link-grid p {
85 margin: 0;
86 color: var(--zen-color-text-muted);
87 font-size: 0.9rem;
88 }
89 </style> 68 </style>
90 </head> 69 </head>
91 <body> 70 <body>
92 {{/parts/header.html}} 71 {{/parts/header.html}}
93 <main> 72 <main>
100 <div class="epi-photo"> 79 <div class="epi-photo">
101 <img id="currentPhoto" style="opacity: 0; transition: opacity 0.2s;" /> 80 <img id="currentPhoto" style="opacity: 0; transition: opacity 0.2s;" />
102 </div> 81 </div>
103 82
104 <h2>Links</h2> 83 <h2>Links</h2>
105 <div class="site-link-grid"> 84 <ul>
106 <a href="https://zenbu.babocoder.com/file/tip"> 85 <li><a href="https://zenbu.babocoder.com/file/tip">Repository</a> - Check out my code</li>
107 <zen-card interactive> 86 <li><a href="/blog">Blogs</a> - My thoughts / Experiments </li>
108 <article><h3>Repository</h3><p>Browse the code behind these experiments.</p></article> 87 <li><a href="/resume">Resume</a> - My professional experiences </li>
109 </zen-card> 88 <li><a href="/tools">Tools</a> - Things I made for myself </li>
110 </a> 89 </ul>
111 <a href="/blog">
112 <zen-card interactive>
113 <article><h3>Blogs</h3><p>Thoughts, experiments, and technical notes.</p></article>
114 </zen-card>
115 </a>
116 <a href="/resume">
117 <zen-card interactive>
118 <article><h3>Resume</h3><p>Professional experience and selected work.</p></article>
119 </zen-card>
120 </a>
121 <a href="/tools">
122 <zen-card interactive>
123 <article><h3>Tools</h3><p>Small things I built for myself.</p></article>
124 </zen-card>
125 </a>
126 </div>
127 <canvas id="background"></canvas> 90 <canvas id="background"></canvas>
128 <canvas id="game"></canvas> 91 <canvas id="game"></canvas>
129 <canvas id="gameUI"></canvas> 92 <canvas id="gameUI"></canvas>
130 </main> 93 </main>
131 {{/parts/footer.html}} 94 {{/parts/footer.html}}