Skip to content

IS-11318 Move Spinner styles to CSS module and simplify component API.#174

Open
urre wants to merge 1 commit into
integration/IS-5161/login-web-appfrom
feat/IS-11318-remove-inline-css-from-spinner
Open

IS-11318 Move Spinner styles to CSS module and simplify component API.#174
urre wants to merge 1 commit into
integration/IS-5161/login-web-appfrom
feat/IS-11318-remove-inline-css-from-spinner

Conversation

@urre
Copy link
Copy Markdown
Collaborator

@urre urre commented May 18, 2026

Summary

  • Moved Spinner from src/login-web-app/src/shared/ui/Spinner.tsx into its own folder (shared/ui/spinner/) alongside a new spinner.module.css, matching the header/ convention already in this app.
  • Removed the inline <style> block (with template-string keyframes) and all style={...} attributes from the component. Per-circle animation offsets now live in CSS modifier classes (.delay2, .delay3).
  • Simplified the component API: dropped width, height, and mode props. Size is now fixed at 48×48 and the flex flex-center flex-column justify-center wrapper (previously mode="fullscreen") is always rendered — matches what the single call site (HaapiStepperStepUI) was already using.

Why

  • The previous component injected a fresh <style> element on every render and used inline style attributes, both of which require style-src 'unsafe-inline' in CSP. Moving to a CSS module produces a linked stylesheet in the Vite production build, so the spinner works under a strict CSP.

@urre urre requested a review from luisgoncalves May 18, 2026 10:19
@urre urre marked this pull request as ready for review May 18, 2026 10:19
@urre urre requested a review from aleixsuau May 18, 2026 10:19
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