Shimmer

Overview

Shimmer is not a Blazor component: it is a shimmer CSS class in zits-ui.css that paints text with background-clip: text off currentColor, so a brighter band sweeps across it in a seamless loop and adapts to any text color. It is auto-applied by ZitsAttachmentTitle while an attachment is uploading/processing, and is disabled automatically under prefers-reduced-motion.

Install

navius add theme --to ./src/MyApp --namespace MyApp.Ui

Usage

<span class="shimmer">Thinking&hellip;</span>
<span class="shimmer shimmer-once">Loaded</span>
<span class="shimmer shimmer-reverse">Streaming reply&hellip;</span>

Parts and props

Not applicable: Shimmer has no Blazor component and no props, only CSS classes applied directly to a text element’s class.

Styling surface

Duration, spread, and color ride on fixed CSS custom properties in this build (--shimmer-duration: 2s), not parametrized utility classes.

Parameter (class)	Values
shimmer	Sweeping highlight loop; respects prefers-reduced-motion.
shimmer-once	A single pass, useful as a completion reveal.
shimmer-reverse	Sweeps in the reverse direction.
shimmer-none	Disables the effect; renders as plain text.

Data attribute hooks

Not applicable: Shimmer emits no data-* attributes; it reads only its own CSS custom properties (--shimmer-duration, --shimmer-spread, --shimmer-highlight).

Shimmer wires no ARIA role or state: it is a purely visual text effect and has no interactive or semantic behavior of its own.