Mercurial

comparison mrjunejune/test/snapshots/jrpg.snapshot @ 263:ee04e4e69fed

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Add functional JRPG frame and tools Add full-screen background_2 apertures, functional frame chrome, card-driven details, dual-window tools, live conversion workflows, and bounded cleanup for generated downloads. Co-authored-by: Copilot <[email protected]>
author MrJuneJune <mrjunejune@users.noreply.github.com>
date Thu, 06 Aug 2026 11:31:30 -0700
parents 0f45474c1b1a
children 04fee26ecce0
comparison
equal deleted inserted replaced
262:0f45474c1b1a 263:ee04e4e69fed
30 src="/public/design-system/components/index.js" 30 src="/public/design-system/components/index.js"
31 ></script> 31 ></script>
32 32
33 <script src="/public/pwa-register.js" defer></script> 33 <script src="/public/pwa-register.js" defer></script>
34 34
35 <link rel="preload" href="/public/jrpg/background-frame-2.webp" as="image">
35 <link rel="preload" href="/public/jrpg/bar-ink.webp" as="image"> 36 <link rel="preload" href="/public/jrpg/bar-ink.webp" as="image">
36 <link rel="stylesheet" href="/jrpg/jrpg.css"> 37 <link rel="stylesheet" href="/jrpg/jrpg.css">
37 <script type="module" src="/jrpg/jrpg.js"></script> 38 <script type="module" src="/jrpg/jrpg.js"></script>
38 </head> 39 </head>
39 <body class="jrpg-page"> 40 <body class="jrpg-page">
40 <main class="jrpg-main"> 41 <main class="jrpg-main">
41 <mjj-jrpg-shell class="jrpg-shell"> 42 <mjj-jrpg-shell class="jrpg-shell">
42 <div class="jrpg-workspace"> 43 <div class="jrpg-workspace">
44 <div class="jrpg-brand">
45 <header>
46 <h1>
47 <a href="/" data-zen-link-effect="none">MrJuneJune</a>
48 </h1>
49 </header>
50 </div>
51 <nav class="jrpg-frame-controls" aria-label="Window controls">
52 <zen-button appearance="plain" size="xs">
53 <button
54 type="button"
55 data-frame-minimize
56 aria-label="Minimize interface"
57 aria-pressed="false"
58 >
59 <zen-icon name="arrow-down"></zen-icon>
60 </button>
61 </zen-button>
62 <zen-button appearance="plain" size="xs">
63 <button
64 type="button"
65 data-frame-fullscreen
66 aria-label="Toggle fullscreen"
67 aria-pressed="false"
68 >
69 <zen-icon name="external"></zen-icon>
70 </button>
71 </zen-button>
72 <zen-button appearance="plain" size="xs">
73 <a href="/" aria-label="Close interface and return home">
74 <zen-icon name="close"></zen-icon>
75 </a>
76 </zen-button>
77 </nav>
78 <footer class="jrpg-frame-telemetry" aria-label="System telemetry">
79 <span aria-label="Temperature unavailable">N/A</span>
80 <span aria-label="User June">JUNE</span>
81 <span data-frame-network aria-label="Status online">ONLINE</span>
82 <time data-frame-uptime aria-label="Uptime">00:00:00</time>
83 </footer>
84
43 <section class="jrpg-scene" aria-label="Shiba Quest conversation"> 85 <section class="jrpg-scene" aria-label="Shiba Quest conversation">
44 <mjj-jrpg-character state="default"> 86 <mjj-jrpg-character state="default">
45 <img data-character alt=""> 87 <img data-character alt="">
46 </mjj-jrpg-character> 88 </mjj-jrpg-character>
47 89
86 </nav> 128 </nav>
87 </mjj-jrpg-chat> 129 </mjj-jrpg-chat>
88 </section> 130 </section>
89 131
90 <section class="jrpg-utility" aria-label="Selected destination"> 132 <section class="jrpg-utility" aria-label="Selected destination">
91 <div class="jrpg-brand">
92 <header>
93 <h1>
94 <a href="/" data-zen-link-effect="none">MrJuneJune</a>
95 </h1>
96 </header>
97 <p>SHIBA QUEST TERMINAL</p>
98 </div>
99
100 <mjj-jrpg-preview data-selection="resume"> 133 <mjj-jrpg-preview data-selection="resume">
101 <article class="jrpg-preview-panel" aria-live="polite"> 134 <article class="jrpg-preview-panel" aria-live="polite">
102 <p class="jrpg-preview-kicker" data-preview-kicker>CHARACTER RECORD</p> 135 <p class="jrpg-preview-kicker" data-preview-kicker>CHARACTER RECORD</p>
103 <zen-heading size="xl"> 136 <zen-heading size="xl">
104 <h2 data-preview-title>Resume</h2> 137 <h2 data-preview-title>Resume</h2>
116 <span>Copilot SuperApp</span> 149 <span>Copilot SuperApp</span>
117 <small>AI platform</small> 150 <small>AI platform</small>
118 </a> 151 </a>
119 </li> 152 </li>
120 </ul> 153 </ul>
121 <dl class="jrpg-preview-stats">
122 <div>
123 <dt>TYPE</dt>
124 <dd data-preview-type>Profile</dd>
125 </div>
126 <div>
127 <dt>STATUS</dt>
128 <dd>Available</dd>
129 </div>
130 </dl>
131
132 <zen-dialog class="jrpg-preview-dialog"> 154 <zen-dialog class="jrpg-preview-dialog">
133 <zen-button appearance="plain" size="md"> 155 <zen-button appearance="plain" size="xs" data-dialog-trigger-owner hidden>
134 <button type="button" data-zen-trigger> 156 <button type="button" data-zen-trigger tabindex="-1" aria-hidden="true"></button>
135 Inspect
136 <zen-icon name="search"></zen-icon>
137 </button>
138 </zen-button> 157 </zen-button>
139 <dialog class="jrpg-detail-dialog" aria-labelledby="jrpg-dialog-title"> 158 <dialog class="jrpg-detail-dialog" aria-labelledby="jrpg-dialog-title">
140 <div class="jrpg-dialog-heading"> 159 <div class="jrpg-dialog-heading">
141 <p>DESTINATION DATA</p> 160 <p>DESTINATION DATA</p>
142 <zen-button appearance="plain" size="md"> 161 <div class="jrpg-dialog-heading-actions">
143 <button type="button" data-zen-close aria-label="Close destination details"> 162 <zen-button appearance="plain" size="md">
144 <zen-icon name="close"></zen-icon> 163 <a href="/resume" data-preview-link>
145 </button> 164 Open page
146 </zen-button> 165 <zen-icon name="external"></zen-icon>
166 </a>
167 </zen-button>
168 <zen-button appearance="plain" size="md">
169 <button type="button" data-zen-close aria-label="Close destination details">
170 <zen-icon name="close"></zen-icon>
171 </button>
172 </zen-button>
173 </div>
147 </div> 174 </div>
148 <h2 id="jrpg-dialog-title" data-dialog-title>Resume</h2> 175 <h2 id="jrpg-dialog-title" data-dialog-title>Resume</h2>
149 <p data-dialog-copy>Experience, projects, and the systems I have helped build.</p> 176 <p data-dialog-copy>Experience, projects, and the systems I have helped build.</p>
150 <section 177 <section
151 class="jrpg-resume-dossier" 178 class="jrpg-resume-dossier"
170 <article> 197 <article>
171 <p data-blog-status>Select a blog to inspect.</p> 198 <p data-blog-status>Select a blog to inspect.</p>
172 <div data-blog-content></div> 199 <div data-blog-content></div>
173 </article> 200 </article>
174 </section> 201 </section>
175 <div class="jrpg-dialog-actions"> 202 <section
176 <zen-button appearance="plain" size="lg"> 203 class="jrpg-tool-browser"
177 <a href="/resume" data-preview-link> 204 data-tool-browser
178 Open full page 205 aria-label="Tool workspace"
179 <zen-icon name="arrow-right"></zen-icon> 206 hidden
180 </a> 207 >
181 </zen-button> 208 <article>
209 <p data-tool-status>Select a tool to inspect.</p>
210 <div data-tool-content></div>
211 </article>
212 </section>
213 <div class="jrpg-dialog-actions" data-dialog-actions>
182 <zen-button appearance="plain" size="lg" data-resume-download> 214 <zen-button appearance="plain" size="lg" data-resume-download>
183 <a href="/public/resume.pdf"> 215 <a href="/public/resume.pdf">
184 Download PDF 216 Download PDF
185 <zen-icon name="download"></zen-icon> 217 <zen-icon name="download"></zen-icon>
186 </a> 218 </a>
204 placeholder="Ask Epi about this site..." 236 placeholder="Ask Epi about this site..."
205 required 237 required
206 ></textarea> 238 ></textarea>
207 </zen-field> 239 </zen-field>
208 <div class="jrpg-composer-actions"> 240 <div class="jrpg-composer-actions">
209 <zen-button appearance="plain" size="lg"> 241 <zen-button appearance="plain" size="sm">
210 <button type="submit"> 242 <button type="submit">
211 Send 243 Send
212 <zen-icon name="arrow-right"></zen-icon> 244 <zen-icon name="arrow-right"></zen-icon>
213 </button> 245 </button>
214 </zen-button> 246 </zen-button>
215 <zen-button appearance="plain" size="lg" data-cancel-control hidden> 247 <zen-button appearance="plain" size="sm" data-cancel-control hidden>
216 <button type="button" data-cancel> 248 <button type="button" data-cancel>
217 Cancel 249 Cancel
218 <zen-icon name="close"></zen-icon> 250 <zen-icon name="close"></zen-icon>
219 </button> 251 </button>
220 </zen-button> 252 </zen-button>
226 <mjj-jrpg-menu> 258 <mjj-jrpg-menu>
227 <nav aria-label="Shiba Quest destinations"> 259 <nav aria-label="Shiba Quest destinations">
228 <p class="jrpg-menu-label">Menu</p> 260 <p class="jrpg-menu-label">Menu</p>
229 <ul> 261 <ul>
230 <li> 262 <li>
231 <zen-button appearance="plain" size="lg"> 263 <zen-button appearance="plain" size="sm">
232 <button type="button" data-preview="resume" aria-pressed="true"> 264 <button type="button" data-preview="resume" aria-pressed="true">
233 <zen-icon name="chevron-right"></zen-icon> 265 <zen-icon name="chevron-right"></zen-icon>
234 Resume 266 Resume
235 </button> 267 </button>
236 </zen-button> 268 </zen-button>
237 </li> 269 </li>
238 <li> 270 <li>
239 <zen-button appearance="plain" size="lg"> 271 <zen-button appearance="plain" size="sm">
240 <button type="button" data-preview="tools" aria-pressed="false"> 272 <button type="button" data-preview="tools" aria-pressed="false">
241 <zen-icon name="chevron-right"></zen-icon> 273 <zen-icon name="chevron-right"></zen-icon>
242 Tools 274 Tools
243 </button> 275 </button>
244 </zen-button> 276 </zen-button>
245 </li> 277 </li>
246 <li> 278 <li>
247 <zen-button appearance="plain" size="lg"> 279 <zen-button appearance="plain" size="sm">
248 <button type="button" data-preview="blog" aria-pressed="false"> 280 <button type="button" data-preview="blog" aria-pressed="false">
249 <zen-icon name="chevron-right"></zen-icon> 281 <zen-icon name="chevron-right"></zen-icon>
250 Blogs 282 Blogs
251 </button> 283 </button>
252 </zen-button> 284 </zen-button>