Skip to content

chore: make CI real + close release-readiness gaps (dim 7)#5

Open
mixflavor wants to merge 84 commits into
mainfrom
chore/ci-and-release-hygiene-2
Open

chore: make CI real + close release-readiness gaps (dim 7)#5
mixflavor wants to merge 84 commits into
mainfrom
chore/ci-and-release-hygiene-2

Conversation

@mixflavor

Copy link
Copy Markdown
Contributor

重做自乾淨 clone(取代衝突的 #4)。

為什麼

「世界第一讚」自檢發現 bleedblend 唯一弱在 ⑦可重現交付:ci.yml、release gate、CHANGELOG.md 三者從沒進過 git,所以測試 CI 一次都沒真跑過。

改了什麼(只動 5 個檔)

  • 新增 .github/workflows/ci.yml + scripts/check-release-readiness.mjs + CHANGELOG.md(原本 untracked、origin 沒有)→ CI 從此每次 push/PR to main 會跑。
  • CI 跑確定性 gate:test:pure(31) + release readiness;需真 Chrome 的 integration 改綁 prepublishOnly 在本機跑(不把瀏覽器塞進 runner)。
  • ci.yml 移除 cache: "npm"package-lock.json 被 gitignore,有 cache 會 hard-fail)。
  • CHANGELOG[2.2.2];src/index.css 檔頭 2.1.0 → 2.2.2 並納入 release-readiness version source(防再漂移);package.jsonprepublishOnly + 填 author

驗證(乾淨 clone @ origin/main 5d8aa63

test:pure 31/0、test:auto 79/0、release readiness passes for v2.2.2。

🤖 Generated with Claude Code

chodaict and others added 30 commits May 26, 2026 18:19
Four-day surgical rewrite. v1's manual `trackScrollColors(stops, options)`
is replaced by `bleed/auto` (zero-config) and `createBleedAuto()` (with
options). The library now auto-detects body::before gradients, opaque
section colors, and the page-end section, and染色 chrome to match the
content at each viewport edge.

BREAKING CHANGES:
- `trackScrollColors`, `setupBleedMeta`, `setThemeColor`, `getSafeAreaInsets`
  removed. Replaced by `createBleedAuto()` and `import 'bleed/auto'`.
- React, Vue, Svelte, UnoCSS framework wrappers removed. Zero-config import
  works from any framework now.

NEW:
- `bleed/auto` — side-effect import that wires everything up.
- `bleed/utils` (rewritten) — exports `createBleedAuto()` + helpers
  (parseColor, parseGradient, sampleColorAt, findLastOpaqueSection, etc.).
- Smart state machine per edge: STICKY_OWNED / SAFE_NATURAL / BLEED_OVERRIDE.
- Detects `boundary.source` ('gradient' vs 'section') for smart decisions.
- Page-end overscroll handling: overwrites <html>, <body>, AND body::before
  bg via injected <style> so iOS rubber-band染色 the right color.

UNCHANGED:
- `bleed/style` CSS (`.bleed-top`, `.bleed-bottom`, `.bleed-inner-blur`).
- Tailwind plugin.

HANDOFF.md added — mental model + iOS 26 quirks documented for future
maintainers.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Page-end染色 overwrite (html/body bg to last section color, body::before
to solid section color) now fades 400ms instead of snapping. Injected as
a one-time <style id="bleed-transition-style"> on first update, removed
on controller.destroy().

The transition only fully interpolates the color portion (body::before
gradient→solid still can't transition smoothly), but in practice when the
gradient terminal color matches the last section color (as in cver.net's
gradient ending in the footer color), the visible transition is fully
smooth.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The old demo was a v1 interactive simulator for the backdrop-filter
clipping fix. v2 is a different problem class (zero-config chrome染色),
so the demo is a focused showcase: gradient hero, the four-day rabbit
hole writeup, opaque belt section, footer at page-end.

The page itself IS the demo — open it on iOS Safari to see bleed染色
status bar + URL bar in action. A floating toggle lets visitors
destroy / re-create the controller for side-by-side comparison.

Removed v1 demo assets (cver-oss-showcase.css, simulator.css).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Two phone frames scroll in sync — left has bleed disabled so chrome染色
stays on the html-bg fallback (the seam you'd see on real iOS Safari
without bleed); right runs a mini-bleed sampling loop against the inner
scrollable container and染色 chrome dynamically as content moves past
the viewport edges.

Same Hero → belt → footer content as cver.net so visitors can map the
demo behavior to the production result.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Brings back the iPhone-frame + control-panel layout that worked so well
in v1, but rewires every interaction for v2's smart染色 model:

- Top/Bottom "buggy / bleed" mode buttons → single "bleed染色 mode"
  toggle (Off shows the broken iOS fallback, On runs the v2 logic).
- Color presets → 5 gradient themes (teal / rose / violet / sun /
  forest). Each theme sets the hero gradient, belt color, footer color
  on the in-phone demo page.
- Phone screen content (dummy cards) → cver.net-style demo page:
  gradient hero + opaque belt + opaque footer.
- New "Live diagnostics" panel exposes top.state, bot.state, chrome.top,
  chrome.bot so visitors can watch the state machine in action while
  scrolling.

JS runs a mini-bleed sampling loop (using parseColor / parseColorWithAlpha
/ colorsClose from bleed/utils) against the inner phone-screen,染色 the
status-bar-info + safari-bottom-liquid-bar + home-indicator-area DOM
elements to mirror what bleed does to real iOS chrome.

Tabs Layout (Compact / Bottom / Top / PWA), Safe Area sliders, and the
overall page chrome (header, footer) are preserved from v1.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Two issues with the deployed demo at oss.cver.net/bleed/:

1. Buttons did nothing because the script imported from ../src/utils.mjs,
   but gh-pages only serves /demo — the src/ folder is not deployed. The
   import failed silently and the script never registered event listeners.
   Fix: inline the few helpers we actually use (parseColor,
   parseColorWithAlpha, colorToRgb, colorToHex, colorsClose) directly in
   the demo script. Source of truth still lives in src/utils.mjs.

2. UI text was mixed Chinese / English. Translated everything visible
   to English (state machine labels, scroll hints, theme picker copy).
   Code comments inside the simulator script are also English now.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The simulator's inner page used to be a simplified hero / belt / footer
that just hinted at the production layout. Replace it with the actual
cver.net homepage shape: hero + intro paragraph + three product cards
(MixFairy, REEF, Open Source) in the belt, plus a faithful footer with
links / logo / copyright.

The result is a much more honest demo — visitors see exactly what bleed
v2 produces on the real cver.net page that drove its design. Includes
an inline SVG cver-mark so no external assets / links are needed.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- HANDOFF.md was accidentally pushed publicly. Untrack from main and add
  to .gitignore so future commits don't re-include it. NOTE: the file
  still exists in earlier git history — see notes in PR / issue if a
  full history purge is needed.
- demo: drop the self-drawn SVG cver mark, point at the real
  cver.net/cver-logo{,-small}.png so the simulator looks identical to
  production. External-asset trade-off accepted for visual fidelity.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Per chodaict's request: keep the cver.net replica page scroll (v2 story)
but bring back v1's three-state Top/Bottom Banner Mode pickers (the .bleed-top
/ .bleed-bottom CSS class showcase) and drop the Safe Area Simulator
sliders (Tabs Layout already sets sensible insets per shell mode).

The control panel is now:
  - Bleed v2 auto-tint  Off / On
  - Top Banner Mode     None / Buggy Blur / Bleed Fix
  - Bottom Action Mode  None / Buggy Blur / Bleed Fix
  - Tabs Layout         Compact / Bottom / Top / PWA
  - Page Theme          5 gradient palettes
  - Live diagnostics    state machine output

When a Bleed Fix banner is active, the sim element carries `.bleed-top` /
`.bleed-bottom` and the v2 controller switches to STICKY_OWNED on that
edge — chrome染色 then comes from the banner directly (matching real
iOS Safari edge sampling). Banner colors are crimson (top) / emerald
(bottom), independent of the Page Theme, so the showcase reads at a
glance.

Banner CSS hard-coded to crimson/emerald (replacing the v1 CSS-var
indirection that depended on color presets we no longer ship).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The v2 release notes / mental model section still had Chinese mixed in
from the original prototype docs. Replace 染色 → tinting / tints, 進場
→ engage, 退場 → step back. Fix sed concat artifacts.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
After the README and demo UI translation, a few code comments in
src/utils.mjs and demo/index.html still mentioned 染色 / 進場 / 退場.
package.json description also had 染色 in the npm metadata. Translated
all to English consistent with the rest of the repo.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…outs

User flagged that Compact / Bottom / Top chrome positions in the iPhone
simulator didn't match real iOS Safari. Root cause: the bottom pill was
placed *above* the safe-area-bottom region (`bottom: calc(safe + 8px)`),
but iOS actually puts it *inside* the chrome region, hugging the viewport
edge. Same issue for the top capsule in Top mode (hardcoded 67px instead
of anchoring to the safe-area-top boundary).

Fixes:
- `.sim-safari-bottom-liquid-bar` now anchors `bottom: 14px` (inside the
  chrome region) regardless of safe-area-bottom — matches Compact /
  Bottom / Top pill positions in real iOS Safari screenshots.
- `.sim-safari-top-capsule` anchors `top: calc(--sim-safe-top - 50px)`
  so it sits at the bottom of the safe-area-top region (just below the
  status bar), instead of a hardcoded 67px.
- Tightened safe-area values per Tabs Layout mode to match the actual
  pill heights + anchor + small breathing room. Compact 90→78,
  Bottom 140→128, Top 90→78 (bottom inset) / 103→104 (top inset).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…look)

Previously the demo painted chrome with a solid bg-color in every state,
which made it look like bleed v2 was always actively painting. In real
iOS, SAFE_NATURAL state means bleed's tint is display:none and Safari
falls back to its native Liquid Glass sampling: a translucent overlay
over the page content with backdrop-filter blur.

Two paint modes now:
  - 'solid'       : bg-color flat fill (BLEED_OVERRIDE, banner Bleed Fix,
                    or Bleed v2 Off fallback)
  - 'translucent' : low-alpha bg + backdrop-filter blur (SAFE_NATURAL —
                    page content shows through with iOS-style blur)

Top edge always uses translucent (matches v2's "top always SAFE_NATURAL"
rule). Bottom uses solid only when BLEED_OVERRIDE engages (gradient
terminal ≠ html bg, or page-end section).

Reported by chodaict.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
… remove computer icon

Three small simulator polish fixes reported by chodaict:

1. Status-bar icons (time / signal / wifi / battery) shifted down in Top
   mode because --sim-safe-top is taller (104 vs 59) and flex centered
   them vertically. Pin them to the TOP of the safe-area region instead
   (align-items: flex-start + padding-top: 14px). Position now stable
   across Compact / Bottom / Top / PWA.

2. Removed the small computer/bed icon next to the clock — it was the
   carrier branding placeholder from the v1 mockup, not real iOS chrome.

3. Auto-contrasting status bar text. Compute Rec. 601 luminance of the
   chrome bg color; flip to black text on light bg (>0.62 luminance),
   white otherwise. Status time + signal / wifi / battery SVGs all use
   currentColor so they pick up the inverted color for free.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Pointing at https://cver.net/logo.gif (the same animated mark cver.net
uses) instead of the static cver-logo.png. The footer mark stays on
cver-logo-small.png for the smaller scale.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…2 tabs

The option-group flex was hardcoded to 3 columns, so:
- Bleed mode (2 buttons) left a dead column on the right.
- Tabs Layout (4 buttons) wrapped to 3+1 with PWA orphan on row 2.
- 'On (smart bleed)' wrapped *inside* its button because longer text
  pushed it past 1fr.

Switch each option-group to a custom column count via `--cols` inline
style, and tighten the buttons:
- Bleed mode    → 2 cols
- Top / Bottom  → 3 cols (None / Buggy / Bleed — drop 'Blur' / 'Fix')
- Tabs Layout   → 2 cols (renders as a 2×2 grid)
- .option-btn   → white-space: nowrap + ellipsis so labels never break

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
no longer reads as a solid band

User flagged that the top status bar and the bottom home-indicator area
still looked like solid color blocks even in translucent mode. The
55% alpha overlay was too opaque — iOS Liquid Glass chrome actually
shows page content with just a very light tint and heavy blur.

Drop the translucent rgba alpha to 0.12 — blur does the visual work now,
the tint just hints at edge color. Bands no longer stand out as "solid"
sitting on top of the page.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…erived themes

- Replace SAFE_NATURAL translucent (low-alpha + blur) with solid sampled
  fill — matches iOS 26 Safari's actual chrome tinting (opaque sample of
  edge content, not Liquid Glass over the page).
- Move gradient from .demo-page::before (absolute, stretched over full
  page length) to .phone-screen (the scroll container) so it stays
  viewport-anchored — same shape as cver.net's fixed body::before, the
  deep end of the gradient now reads at the bottom of the viewport
  instead of being scrolled past.
- Re-derive theme palettes from the CVER mint→teal shape via hue
  rotation (60/80 → 87/30 in HSL, +28° hue shift). Drops the mismatched
  sun/rose/violet/forest hardcoded swatches in favor of teal / ocean /
  violet / rose / forest that all share the same visual gravity. Adds
  two solid presets (white, black) for testing chrome on max- / no-
  contrast edge cases.
- Fix chrome.bot diagnostics reading .style.background instead of
  .style.backgroundColor (was always showing dash).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Reverts the demo footer to the brand-neutral version from before
80f6611 ("replicate full cver.net homepage inside the phone"), which
was intended as the reusable template for future demos. The CVER-
specific footer (cver-logo-small.png img + "CVER.NET © 2011–2026 CVER
Inc. | Language") was a one-off for the homepage replication and
shouldn't be the canonical demo template.

Drops the now-unused .demo-footer-sep and .demo-footer-logo CSS rules
and restores the original padding / link styling.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Internal state-machine output (top.state, bot.state, chrome.top,
chrome.bot) is jargon-heavy for visitors evaluating bleed and adds
noise to the panel without explaining what the values mean. Developers
who want the same view at runtime can read window.__bleed_* globals in
devtools on their own page.

Removes the HTML section, the JS writeback in runUpdate, the now-
unused colorToHex helper, and the .log-card / .log-line styles in
cver-oss-showcase.css.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
iOS 26 Safari no longer renders the home indicator pill inside the
browser viewport, so showing one in the simulator is misleading. The
.home-indicator-area band stays — it's still the bottom safe-area
tint strip that visualizes the rubber-band-overscroll region.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The hero section had min-height: 100% but its parent .demo-page only
sets min-height: 100% (not height), so the percentage chain collapses
and the hero ended up just tall enough for its own content. The belt
section was visible above the fold, which doesn't match how the real
cver.net page reads on iPhone — hero owns the first viewport.

Switch to container-query units: make .phone-screen a size container
and anchor the hero to 100cqh. The hero now reliably fills the phone
viewport regardless of where the percentage chain breaks down.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Time text and signal/wifi/battery icons now sit vertically centered on
the dynamic island's center line (island is top:11 height:30, center
y=26), matching how real iOS positions the status bar around the
notch. The status-bar-info element still spans the full safe-area-top
so chrome tinting paints all the way to the top edge — only the inner
flex contents are pinned to the island row.

Also bumps font-size 0.75rem → 0.9rem and grows each SVG icon ~25%
for readability at the simulator's scale.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Apple's chassis corners since iPhone 15 are a G2-curvature-continuous
squircle, not a circular radius. A symmetric border-radius reads
slightly sharper than real iPhones at this scale.

Switch .phone-frame and .phone-screen to the asymmetric `X / Y`
shorthand to stretch the arc transition zone and approximate the
squircle look in pure CSS:
  - frame:  48 48 48 48 / 50 50 50 50
  - screen: 38 38 38 38 / 40 40 40 40

Tuned for the standard (non-Max) class around 6.1–6.3" (logical width
~393px; demo uses 375 — values translate cleanly).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The previous commit centered the status bar items on the dynamic
island's vertical center via align-items, but the time text still
read as floating above the SVG icons. Cause: default line-height of
1.2 leaves vertical leading inside the text's line box, so flex
center-alignment lined up the box but the glyph itself sat above
center. Set line-height: 1 on each inner flex row so text and SVGs
share an optical center.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Status bar, Safari capsules, sticky banners, and the bottom safe-area
tint band were direct children of .phone-frame, sitting outside the
.phone-screen rounded clip. With the iPhone 15+ squircle radii now on
the screen, those overlays kept hard 90° corners — most visible in
Top/Bottom Banner Bleed combinations where the System Warning red
banner and the Proceed-to-checkout green banner painted square edges
into the bezel.

Move them inside .phone-screen (only the camera notch stays on the
bezel, as it should). The screen's overflow + border-radius now clips
all overlays to the squircle.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
chodaict and others added 28 commits May 28, 2026 11:36
…publish)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…tor.css

Dogfood the extracted liquidframe OSS: vendor liquidframe.css (@f36c2b0) as
the phone-frame base, switch shell-mode switching to its .chrome-* classes,
and split demo-only styles (fake page, banners, inner-blur) into
bleedblend-demo.css. Drops the duplicated simulator.css. The bespoke
auto-tint engine is unchanged.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…cver-oss-showcase.css

Dogfood the extracted demodeck OSS: vendor demodeck.css (@d926da2), rename the
control-panel markup to demodeck's .dd-* classes, and reskin it to bleedblend's
teal via demodeck's :root retheme (bleedblend-panel.css). Drops the duplicated
cver-oss-showcase.css. Keeps the auto-tinting toggle's signature green.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…hem from --dd-accent

Re-sync vendored demodeck.css (@fbe18a2): its accent glows now use
color-mix(in srgb, var(--dd-accent) …%, transparent), so bleedblend's teal :root
retheme carries the badge/active-btn glows automatically. Removes the now-redundant
glow patches from bleedblend-panel.css (the green auto-tinting toggle stays).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…oss site shapes

Drives the locally installed Chrome over CDP (no npm install) plus pure-function
unit tests. Exercises bleedblend's entire JS decision path — edge state machine,
chosen color, tint application, html/body/::before overscroll overwrite, desktop
no-op, double-init idempotency and destroy cleanup — against a battery of synthetic
"any site" shapes (solid, gradient vs html-bg, sections+footer, dark mode, sticky
owned edges, translucent compositing, image bg, non-semantic markup + custom
sectionSelector escape hatch).

Surfaces one real robustness gap: oklch()/color(display-p3) backgrounds are
serialized verbatim by the browser and parseColor returns null for them, so such
sites silently fall back to SAFE_NATURAL. The native Safari chrome paint itself
still needs a real iOS 26 device to confirm.

  npm run test:pure   # node-only
  npm run test:auto   # headless Chrome via CDP
  npm run test:all

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…adback

getComputedStyle serializes modern color functions verbatim instead of
down-converting to rgb, so the regex-only parseColor returned null for
oklch()/lab()/lch()/color(display-p3 …) backgrounds and gradient stops — those
sites silently fell back to SAFE_NATURAL (no tint). parseColor now adds a
last-resort normalizer that paints the value into a 1px canvas and reads it back
as sRGB, covering ANY color the browser can render (alpha preserved, invalid →
null). parseGradient's stop tokenizer now captures balanced-paren function
colors and named keywords so modern-syntax gradient stops resolve too.

DOM-guarded: off-DOM (Node) the canvas path is skipped and these return null by
design, so the pure exports stay pure. Mirrored across utils.mjs and utils.js.

Verified by new integration cases L (oklch gradient terminal) and M
(display-p3 footer): both now engage BLEED_OVERRIDE with the correct color
(previously SAFE_NATURAL / mis-sampled). Full suite: pure 31/31, integration 59/59.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Aligns package.json with the src/index.css header and releases the universal
CSS-color resolution (oklch/lab/lch/hwb/color()) feature.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Universal CSS-color auto-tint + zero-dependency verification harness
The dd-logo linked to the GitHub repo; it should lead back to the
project's home on cver.net so the demo ↔ site loop is closed.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…26 family)

Rework "Browser support" to prevent a recurring misread: bleedblend does
not *manufacture* chrome tinting, it *tames* the tinting Safari 26 already
does. Safari 26's Liquid Glass tints chrome from page content across the
whole Safari family (iPhone, iPad, AND Mac) via body bg / top fixed
element sampling; theme-color meta is now ignored.

Per-surface table now states what bleedblend actually contributes:
actively tames iOS/iPadOS quirks; deliberately steps back on Mac (native
model is well-behaved, so display:none deferral is by-design, not a gap);
no-op on non-tinting browsers. Adds a sourced "Safari 26 tinting model"
background section.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…int (#2)

The 'Sticky banners' section opened with 'if you have your own sticky
header that already tints chrome correctly … bleedblend will step out of
the way' — which reads as a defer flag for bars that ALREADY work. A
reader whose nav does NOT tint (the common case) skips the section,
missing that .bleedblend-top + bleedblend/style is precisely the recipe
to MAKE it tint.

- Retitle + reframe as 'Make your own sticky header / footer tint the chrome'.
- Lead with the value; call out stripping backdrop-filter as the #1 reason
  a sticky nav silently refuses to tint (WebKit safe-area clipping), with
  the tell-tale symptom (looks right on screen, chrome stays white).
- Show the .bleedblend-inner-blur pattern to keep the frosted look.
- Note the viewport-fit=cover-in-SSR-head prerequisite (JS-injected after
  load is unreliable on iOS).
- Add an opt-in pointer from the 'top stays light' bullet so readers know
  top branding is achievable, not out of scope.

Found the hard way while wiring bleedblend onto a real cream sticky nav
with backdrop-filter — only auto was loaded, the top never tinted, and
the docs framing was why the .bleedblend-top fix got skipped.

Co-authored-by: mixflavor <mr.crazyx2@gmail.com>
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
…Mac)

README headline + package.json description said 'iOS Safari chrome tinting',
implying iOS-only. Safari 26's Liquid Glass tints chrome across the whole
Safari family, and the Browser support table already documents this — the
headline now matches. GitHub repo description + topics (macos, ipados,
webkit) already updated to match.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2.1.0 shipped the old iOS-only description/README. This patch carries the
Safari-family reframing (title, description, browser-support matrix) to npm.
No code change.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…r.net → extracted)

The 'four-day rabbit hole' framing undersold the history. bleedblend's real
origin: a backdrop-filter notch-clipping bug in reef, reframed into 'paint
the exposed safe-area strip on purpose', battle-tested across cver.net's
full-bleed homepage, then extracted. Narrative only — no links to removed
commits. Reinforces that it shipped in production first, not a weekend toy.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Page-end overwrite dyed html+body+body::before with the last opaque
section's color, flooding the visible background of flat light pages
with a short high-contrast footer. Classify the end section as a
designed end-zone vs an incidental footer; for the incidental case
tint <html> only (correct rubber-band color, body left alone). Add
overscrollFill: 'auto'|'always'|'never' escape hatch. Backward
compatible: tall/gradient/continuous endings still fully overwrite.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The Despair section and the README badge still read iOS-only, while the
intro, compatibility note, and the positive sticky-bar recipe already
position bleedblend across the whole Safari 26 family. Close the gap on
the two surface-level spots without overclaiming Mac:

- Badge: "iOS Safari 26" -> "Safari 26".
- The Despair opener: lead with the family-wide model (iPhone/iPad/Mac),
  then scope the sharp quirks to where they bite hardest (iPhone/iPad).
- Close the section on the positive capability: bleedblend lets you make
  any sticky bar tint the chrome on purpose, across the family.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
bleedblend's docs/philosophy and root-cause design were already world-class,
but "reproducible delivery" (dim 7) was weak: the CI workflow, the release
gate, and the CHANGELOG had never been committed, so CI had never actually run.

- Add .github/workflows/ci.yml + scripts/check-release-readiness.mjs + CHANGELOG.md
  (were untracked → never on origin). CI now runs on every push/PR to main.
- CI runs the deterministic gate: test:pure (31) + release readiness. The
  Chrome/CDP integration suite (test:auto) is bound to prepublishOnly so it runs
  locally before each publish — no browser dependency in the runner.
- ci.yml drops `cache: "npm"` (package-lock.json is gitignored → cache would
  hard-fail for lack of a lockfile).
- CHANGELOG: add [2.2.2] (release gate requires a section matching the version).
- src/index.css header bumped 2.1.0 → 2.2.2 and registered as a release-readiness
  version source so it can never drift silently again; description aligned to the
  Safari-family positioning.
- package.json: add prepublishOnly + fill the empty author field.

Local (fresh clone @ origin/main 5d8aa63): test:pure 31/0, test:auto 79/0,
release readiness passes for v2.2.2.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@mixflavor mixflavor force-pushed the main branch 2 times, most recently from d5d95e2 to df5d352 Compare June 16, 2026 00:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants