mirror of
https://github.com/alkimake/paperclip.git
synced 2026-06-15 02:20:38 +09:00
85 lines
3.4 KiB
HTML
85 lines
3.4 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8" />
|
||
|
|
<title>LLM Wiki UI Harness</title>
|
||
|
|
<style>
|
||
|
|
:root {
|
||
|
|
--background: oklch(0.145 0 0);
|
||
|
|
--foreground: oklch(0.985 0 0);
|
||
|
|
--card: oklch(0.205 0 0);
|
||
|
|
--primary: oklch(0.985 0 0);
|
||
|
|
--primary-foreground: oklch(0.205 0 0);
|
||
|
|
--secondary: oklch(0.269 0 0);
|
||
|
|
--secondary-foreground: oklch(0.985 0 0);
|
||
|
|
--muted: oklch(0.269 0 0);
|
||
|
|
--muted-foreground: oklch(0.708 0 0);
|
||
|
|
--accent: oklch(0.269 0 0);
|
||
|
|
--accent-foreground: oklch(0.985 0 0);
|
||
|
|
--border: oklch(0.269 0 0);
|
||
|
|
--input: oklch(0.269 0 0);
|
||
|
|
--sidebar: oklch(0.145 0 0);
|
||
|
|
}
|
||
|
|
html, body, #root {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
height: 100%;
|
||
|
|
background: var(--background);
|
||
|
|
color: var(--foreground);
|
||
|
|
font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Minimal Tailwind utility shim — supports just the classes used by the */
|
||
|
|
/* plugin's WikiRouteSidebar so the screenshot harness renders something */
|
||
|
|
/* visually close to the production host (which compiles real Tailwind). */
|
||
|
|
.w-60 { width: 15rem; }
|
||
|
|
.h-full { height: 100%; }
|
||
|
|
.min-h-0 { min-height: 0; }
|
||
|
|
.border-r { border-right-width: 1px; border-right-style: solid; }
|
||
|
|
.border-t { border-top-width: 1px; border-top-style: solid; }
|
||
|
|
.border-border { border-color: var(--border); }
|
||
|
|
.bg-background { background: var(--background); }
|
||
|
|
.bg-accent { background: var(--accent); }
|
||
|
|
.flex { display: flex; }
|
||
|
|
.flex-col { flex-direction: column; }
|
||
|
|
.flex-1 { flex: 1; }
|
||
|
|
.items-center { align-items: center; }
|
||
|
|
.gap-0\.5 { gap: 0.125rem; }
|
||
|
|
.gap-1 { gap: 0.25rem; }
|
||
|
|
.gap-1\.5 { gap: 0.375rem; }
|
||
|
|
.gap-2 { gap: 0.5rem; }
|
||
|
|
.gap-2\.5 { gap: 0.625rem; }
|
||
|
|
.mb-2 { margin-bottom: 0.5rem; }
|
||
|
|
.mb-3 { margin-bottom: 0.75rem; }
|
||
|
|
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
|
||
|
|
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
|
||
|
|
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
|
||
|
|
.py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
|
||
|
|
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
|
||
|
|
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
|
||
|
|
.shrink-0 { flex-shrink: 0; }
|
||
|
|
.text-xs { font-size: 0.75rem; line-height: 1rem; }
|
||
|
|
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
|
||
|
|
.text-\[11px\] { font-size: 11px; }
|
||
|
|
.text-\[13px\] { font-size: 13px; }
|
||
|
|
.font-medium { font-weight: 500; }
|
||
|
|
.font-semibold { font-weight: 600; }
|
||
|
|
.font-bold { font-weight: 700; }
|
||
|
|
.uppercase { text-transform: uppercase; }
|
||
|
|
.tracking-normal { letter-spacing: 0; }
|
||
|
|
.text-foreground { color: var(--foreground); }
|
||
|
|
.text-foreground\/80 { color: color-mix(in oklab, var(--foreground) 80%, transparent); }
|
||
|
|
.text-muted-foreground { color: var(--muted-foreground); }
|
||
|
|
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||
|
|
.rounded-md { border-radius: 0.375rem; }
|
||
|
|
.transition-colors { transition: background-color 150ms, color 150ms; }
|
||
|
|
.overflow-y-auto { overflow-y: auto; }
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div id="root"></div>
|
||
|
|
<script type="module" src="/bundle.js"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|