Mercurial
diff mrjunejune/src/talk/index.html @ 258:60a876c4587a
[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 | c1eab8c0b0f9 |
| children |
line wrap: on
line diff
--- a/mrjunejune/src/talk/index.html Tue Aug 04 16:49:11 2026 -0700 +++ b/mrjunejune/src/talk/index.html Wed Aug 05 05:25:40 2026 -0700 @@ -5,8 +5,8 @@ <title>Talk!</title> {{/parts/base_head.html}} <style> - body { font-family: sans-serif; padding: 20px; } - #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: 10px; padding: 10px; } + body { font-family: sans-serif; padding: var(--zenbu-sys-padding-lg); } + #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: var(--zenbu-sys-space-control); padding: var(--zenbu-sys-padding-md); } #chat { display: flex; gap: 10px; } input { flex-grow: 1; } </style> @@ -19,8 +19,12 @@ <div id="messages"></div> <div id="chat"> - <input type="text" id="messageInput" placeholder="Type a message..."> - <button id="sendBtn">Send</button> + <zen-input appearance="plain" size="md"> + <input type="text" id="messageInput" placeholder="Type a message..."> + </zen-input> + <zen-button appearance="plain" size="md"> + <button id="sendBtn">Send</button> + </zen-button> </div> </main> {{/parts/footer.html}}