Skip to content

fix(site): align the ascent authorization pane and gold key - #24

Merged
patschmittdev merged 1 commit into
mainfrom
patschmittdev-ascent-diagram-alignment
Sep 12, 2026
Merged

fix(site): align the ascent authorization pane and gold key#24
patschmittdev merged 1 commit into
mainfrom
patschmittdev-ascent-diagram-alignment

Conversation

@patschmittdev

Copy link
Copy Markdown
Owner

Summary

Correct the pictured AscentFigure alignment defects without changing the tier sizes, theme, labels, admission explanation, or external-custody assumptions.

  • Center the recessed pane, key circle, and plate frame on the existing x=236 tier axis. Keep the signing shaft originating outside the frame and connect it exactly to the circle.
  • Center the refusal row inside the pane with equal nominal side padding. Widen the stamp within the unchanged row width so mobile text, including the declared Arial fallback, retains readable insets.
  • Align the affected focus rings and datum cursor, and lower the key label enough to clear the pane's top lip at mobile font sizes.
  • Add rendered SVG regression assertions for shared axes, preserved tier sizes, painted containment, connectors, focus geometry, and label bounds. Geometry checks load the site with JavaScript disabled.

Measurements

All values are SVG user units, from the baseline source/rendered regression failures and final rendered SVG geometry.

Geometry Before After
Tier axis 236 236, unchanged
Pane bounds / axis 88..388 / 238 86..386 / 236
Key center / radius (254, 214) / 11 (236, 214) / 11
Shaft endpoint / circle right edge 266 / 265 247 / 247
Shaft external origin (470, 214) (470, 214), unchanged
Refusal row bounds / axis 134..396 / 265 105..367 / 236
Refusal painted side insets left 45.25, right -9 left 18.25, right 18
Source / stamp widths 176 / 78 160 / 94
Frame rails / axis 44..432 / 238 44..428 / 236
Mobile REFUSED right inset 0.2503 11.3236 system font; 6.9206 Arial fallback
Mobile key label top 184.069, above pane top 186 188.069, inside pane

Validation

  • Reproduced the original geometry failures in all six viewport/theme combinations before the component change.
  • 12 focused Playwright checks passed: six static/no-JavaScript geometry cases and six scripted homepage visual/accessibility cases.
  • Inspected before and final diagram screenshots at desktop 1280x900, tablet 834x1112, and mobile 390x844, each in light and dark themes. Final SVG display widths were 480, 480, and 348 CSS pixels.
  • npm run site:check passed: no typecheck diagnostics, seven plugin tests, production build, and internal-link/asset validation.
  • npm run check passed: 728 runtime tests passed, three existing skips, 11 script tests passed, plus link/style checks.
  • Explicit clean-room audit passed with no findings; git diff --check passed.
  • Screenshots, JSON geometry measurements, and logs are stored outside the repository in the implementing session's artifacts.

Visual checks cover these configurations, not every possible browser or platform. No workflow, deployment, branch-protection, runtime, or policy changes are included. Parent session owns merge coordination.

Center the pane, key and frame on the existing tier axis. Contain the refusal row with room for mobile and fallback-font labels, and cover rendered SVG geometry without JavaScript.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@patschmittdev
patschmittdev merged commit a252121 into main Sep 12, 2026
7 checks passed
@patschmittdev
patschmittdev deleted the patschmittdev-ascent-diagram-alignment branch September 12, 2026 20:58
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.

1 participant