Design tokens sourced from Figma file: ALPA mobile app (1).fig · Component: slider / section title
Content & Behavior (Image / Text Slider — Teamwork mobile requirements, Space 4173)
The Carousel realizes two slider variants. Both: a section header on the left + a
"View All" / "View Media Hub" text link upper-right (→ the full repository for the selected
taxonomy); a horizontally scrollable row that partially reveals the next card for scroll
affordance; max 8 cards; content is CMS / taxonomy-driven, ordered most-recent.
The favorite heart is per-user (filled = favorited / outline = not). Source:
mobile-requirements — Image Slider / Text Sliders;
data source per Content Contract; type↔component validity per
DQ-24.
Variant
Card anatomy
Truncation
Image Slider
Image · Eyebrow · heart/favorite · Title. Tap opens the linked file.
Title max 2 lines, ellipsis.
Text Slider
Optional Eyebrow · heart/favorite · Title · Body. Tap opens the linked page. Two modes: taxonomy-driven (eyebrow auto from taxonomy) or manually populated (eyebrow toggle + manual text).
Title max 2 lines; Body max 3 lines; ellipsis.
Design Tokens (from Figma)
Dimensions
Section title width
313 px
Section title height
38 px
Pagination control
313×5 px
Active dot
17×17 px
Colors
Section title
#05273E
Link / active dot
#007BC2
Pagination track
#E3E3E3
Typography
Section title
Inter Bold 12px ls=5% uppercase
Link text
Futura PT Book 16px
Card items
Inherits from CardViewModel
Layer Structure
[FRAME] section title 313×38
[TEXT] title #05273e
[TEXT] View All #007bc2
[FRAME] controls 313×5 #e3e3e3
[ELLIPSE] active dot #007bc2 17×17
[CardViewModel] items polymorphic
These fields come from ContainerDto via the dynamic feed and are shared by all four container ViewModels. All token fields are server-populated from the component-type → theme mapping — not set by editors (D37).
API field (ContainerDto)
ViewModel property
Notes
backgroundToken
BackgroundToken: string
Surface/* token resolved via IThemeResolver at render time