Move SX app CSS and init behavior from Python to init.sx

Styles (indicator, jiggle animation) and nav aria-selected behavior
were inline Python strings in sx/app.py. Now they live in sx/sx/init.sx
as proper SX source — styles via collect! "cssx", nav via dom-listen.

The shell's inline_css is empty; CSSX handles style injection on boot.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-14 11:11:49 +00:00
parent 2211655060
commit 919998be1c
2 changed files with 31 additions and 20 deletions

24
sx/sx/init.sx Normal file
View File

@@ -0,0 +1,24 @@
;; ---------------------------------------------------------------------------
;; SX app boot — styles and behaviors injected on page load
;;
;; Replaces inline_css and init_sx from Python app config.
;; Called as a data-init script on every page.
;; ---------------------------------------------------------------------------
;; Framework styles — request indicators + link jiggle
(collect! "cssx" ".sx-indicator{display:none}")
(collect! "cssx" ".sx-request .sx-indicator{display:inline-flex}")
(collect! "cssx" "@keyframes sxJiggle{0%,100%{transform:translateX(0)}25%{transform:translateX(-.5px)}75%{transform:translateX(.5px)}}")
(collect! "cssx" "a.sx-request{animation:sxJiggle .3s ease-in-out infinite}")
;; Nav link aria-selected update on client-side routing
(dom-listen (dom-body) "sx:clientRoute"
(fn (e)
(let ((p (get (event-detail e) "pathname")))
(when p
(for-each
(fn (a) (dom-set-attr a "aria-selected" "false"))
(dom-query-all "nav a[aria-selected]"))
(for-each
(fn (a) (dom-set-attr a "aria-selected" "true"))
(dom-query-all (str "nav a[href=\"" p "\"]")))))))