dnoulet/go-bananas
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

initial commit
Some checks failed
ci / go (push) Has been cancelled
Details
ci / admin-ui (push) Has been cancelled
Details
ci / runtime-sdk (push) Has been cancelled
Details
ci / helm (push) Has been cancelled
Details
ci / openapi (push) Has been cancelled
Details
ci / container (push) Has been cancelled
Details
ci / release-config (push) Has been cancelled
Details
ci / shared styling (push) Has been cancelled
Details
ci / security (push) Has been cancelled
Details
ci / all green (push) Has been cancelled
Details

Browse source
This commit is contained in:
Daniel Noulet 2026-10-07 15:11:35 +02:00
commit 951dd8d26b
175 changed files with 50041 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

76
hack/integration-check.html Normal file
View file

@ -0,0 +1,76 @@
<!doctype html>
<html lang="en" data-theme="midnight" data-mode="dark">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Shared styling — integration check</title>
<!-- The contract. One stylesheet, every palette. SBN_BASE lets one copy of this file
be served from anywhere while still pointing at the service. -->
<link rel="stylesheet" href="/rt/v1/contract.css" id="contract-link">
<style>
/* Host page styling, deliberately using only the unprefixed legacy aliases, which
is how the applications being consolidated are written today. If the alias layer
works, everything below is themed without a single rename. */
:root { --page-gap: 16px; }
body {
margin: 0;
padding: var(--page-gap);
background: var(--bg);
color: var(--text);
font: 15px/1.5 ui-sans-serif, system-ui, sans-serif;
}
.card {
background: var(--surface);
border: 1px solid var(--line);
border-radius: 12px;
padding: calc(var(--page-gap) * 1.25);
margin-bottom: var(--page-gap);
}
h1 { margin: 0 0 4px; font-size: 1.25rem; }
.muted { color: var(--muted); }
.swatchrow { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.swatchrow > div {
width: 44px; height: 28px; border-radius: 6px;
box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.15);
}
/* A rule that would wreck an unisolated injected component. */
.card button { all: unset; }
/* The shadow-root proof: this must not touch anything inside either component. */
button { font: inherit; }
</style>
</head>
<body>
<main>
<div class="card">
<h1>Shared styling</h1>
<p class="muted">This page uses only the unprefixed legacy aliases: <code>--bg</code>,
<code>--text</code>, <code>--line</code>, <code>--accent</code>.</p>
<div class="swatchrow" id="row"></div>
</div>
<div class="card">
<h1>The controls</h1>
<p class="muted">Injected, not hand-written. Shadow DOM isolates them from the
<code>.card button {{ all: unset }}</code> rule above.</p>
<div style="display:flex;gap:12px;align-items:center;flex-wrap:wrap">
<bananas-theme-selector id="selector"></bananas-theme-selector>
<bananas-appearance-toggle id="toggle" show-labels></bananas-appearance-toggle>
</div>
</div>
<div class="card">
<h1>Host page, after the components</h1>
<p class="muted">If component styles leaked, this card would change. It must not.</p>
<button id="host">A plain host button</button>
</div>
<pre id="state" class="card" style="font:12px/1.6 ui-monospace,monospace"></pre>
<div id="verdict" style="font:16px/1.4 monospace;padding:12px;border:2px solid #888"></div>
</main>
<script type="module" src="./contract-check.js"></script>
</body>
</html>