From 097a5dd437e002134a3ebea2d903e43acea35178 Mon Sep 17 00:00:00 2001 From: Disco DeDisco Date: Fri, 8 May 2026 14:44:54 -0400 Subject: [PATCH] my-sky applet DEL btn: shift left by half the applet's padding asymmetry so it re-aligns w. the SVG center MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The applet section uses padding 0.75rem 0.75rem 0.75rem 2.5rem — the 2.5rem left gutter holds the rotated h2 — so the SVG's geometric center lands 0.875rem right of the applet's padding-box center. Absolute positioning on the DEL btn references the padding box center, which put the btn 14px left of the wheel's actual center. Compensating w. left:calc(50% + 0.875rem) on #id_applet_sky_delete_btn re-aligns the btn (verified 0px dx/dy in the live browser). The other two DEL anchors (Dashsky #id_sky_delete_form & PICK SKY #id_sky_delete_btn) live in symmetric .sky-wheel-col containers so the base 50%/50% rule still works for them. Code architected by Disco DeDisco Git commit message Co-Authored-By: Claude Sonnet 4.6 --- src/static_src/scss/_sky.scss | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/static_src/scss/_sky.scss b/src/static_src/scss/_sky.scss index ba2b31f..cfcb335 100644 --- a/src/static_src/scss/_sky.scss +++ b/src/static_src/scss/_sky.scss @@ -972,6 +972,14 @@ body.page-sky { margin: 0; } +// The applet's padding is asymmetric — 2.5rem left (rotated h2 gutter) and +// 0.75rem right — so the SVG's geometric center sits 0.875rem right of the +// applet's padding-box center. Shift the DEL btn by half the asymmetry so it +// re-aligns with the SVG's actual center instead of the applet's box center. +#id_applet_sky_delete_btn { + left: calc(50% + 0.875rem); +} + // Stack wheel above form; allow body to grow past viewport (page scrolls, not body) .sky-page .sky-modal-body { flex-direction: column;