comparison 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
comparison
equal deleted inserted replaced
257:609d3c6aff4e 258:60a876c4587a
3 <head> 3 <head>
4 <meta charset="UTF-8"> 4 <meta charset="UTF-8">
5 <title>Talk!</title> 5 <title>Talk!</title>
6 {{/parts/base_head.html}} 6 {{/parts/base_head.html}}
7 <style> 7 <style>
8 body { font-family: sans-serif; padding: 20px; } 8 body { font-family: sans-serif; padding: var(--zenbu-sys-padding-lg); }
9 #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: 10px; padding: 10px; } 9 #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: var(--zenbu-sys-space-control); padding: var(--zenbu-sys-padding-md); }
10 #chat { display: flex; gap: 10px; } 10 #chat { display: flex; gap: 10px; }
11 input { flex-grow: 1; } 11 input { flex-grow: 1; }
12 </style> 12 </style>
13 </head> 13 </head>
14 <body> 14 <body>
17 <h1>Talk with strangers xDDD</h1> 17 <h1>Talk with strangers xDDD</h1>
18 18
19 <div id="messages"></div> 19 <div id="messages"></div>
20 20
21 <div id="chat"> 21 <div id="chat">
22 <input type="text" id="messageInput" placeholder="Type a message..."> 22 <zen-input appearance="plain" size="md">
23 <button id="sendBtn">Send</button> 23 <input type="text" id="messageInput" placeholder="Type a message...">
24 </zen-input>
25 <zen-button appearance="plain" size="md">
26 <button id="sendBtn">Send</button>
27 </zen-button>
24 </div> 28 </div>
25 </main> 29 </main>
26 {{/parts/footer.html}} 30 {{/parts/footer.html}}
27 <script> 31 <script>
28 const host = window.location.hostname; 32 const host = window.location.hostname;