mirror of
https://github.com/remorses/gpuix.git
synced 2026-10-28 18:59:22 +08:00
`bun scripts/web.ts` now registers one bundled document per example:
`/` keeps the chat and `/infinite` serves the infinite history. The
shared cross-origin isolation headers wrap each document the same way.
The inline page styles move from web.html into a shared web.css that
both documents import, and web-infinite-chat.{html,tsx} are the browser
entry pair for the example. bun.lock picks up string-dedent for the
example's seeded message generator.
Session: ses_fbc66676dffeMDwZ3jJhimdkw6
45 lines
1.5 KiB
CSS
45 lines
1.5 KiB
CSS
/* Shared page chrome for every GPUIX browser example. */
|
|
|
|
* { box-sizing: border-box; }
|
|
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: #11111b; }
|
|
canvas { display: block; width: 100%; height: 100%; touch-action: none; }
|
|
|
|
#gpuix-loader {
|
|
position: fixed;
|
|
inset: 0;
|
|
display: grid;
|
|
place-items: center;
|
|
color: #fafafa;
|
|
font: 14px/1.5 Inter, ui-sans-serif, system-ui, sans-serif;
|
|
}
|
|
#gpuix-loader > div { display: flex; flex-direction: column; align-items: center; gap: 14px; }
|
|
#gpuix-loader strong { font-size: 15px; font-weight: 500; letter-spacing: -0.01em; }
|
|
#gpuix-loader span { color: #8b8b96; font-size: 13px; }
|
|
#gpuix-loader i {
|
|
width: 18px;
|
|
height: 18px;
|
|
border: 2px solid #34343e;
|
|
border-top-color: #fafafa;
|
|
border-radius: 50%;
|
|
animation: gpuix-spin 0.8s linear infinite;
|
|
}
|
|
@keyframes gpuix-spin { to { transform: rotate(360deg); } }
|
|
|
|
/* The app draws every glyph itself, so the browser must not treat the page as
|
|
a document: a long press would otherwise select the whole body and pop the
|
|
iOS callout, and a tap would flash the tap highlight over the full-screen
|
|
canvas. GPUIX handles long press and selection in its own code. */
|
|
html, body, canvas {
|
|
-webkit-user-select: none;
|
|
user-select: none;
|
|
-webkit-touch-callout: none;
|
|
-webkit-tap-highlight-color: transparent;
|
|
}
|
|
|
|
/* GPUI's hidden IME textarea still needs a real selection for composition,
|
|
backspace context, and clipboard. */
|
|
[data-gpui-input] {
|
|
-webkit-user-select: text !important;
|
|
user-select: text !important;
|
|
}
|