Files
vue-faq-layer/app/assets/css/faq-tokens.css
Jakub Zych 2d62924b78 feat: FaqBlock layer for the SummerCMS FAQ API
- typed client and useFaq/useFaqApi (SSR, faq:<slug>:<locale> key,
  server and public bases, x-forwarded-for forwarded also on cached renders)
- FaqBlock, FaqList and FaqItem: native details, exclusive and openFirst,
  server-sanitized description and answers, nothing or #fallback on 404,
  error or no items
- FAQ tokens and base CSS with the .faq-html rules, README
- node client tests and a playground SSR smoke against a fixture API
2026-10-12 18:22:03 +02:00

29 lines
928 B
CSS

/* FAQ design tokens. Every visual value of FaqBlock comes from these. An app
overrides any of them in its own CSS, e.g. on :root:root. */
:root {
/* Colour */
--faq-color-text: #1f2328; /* questions, answers, chevron */
--faq-color-muted: #59636e; /* quotes */
--faq-color-bg: #ffffff; /* item background */
--faq-color-surface: #f6f8fa; /* summary hover */
--faq-color-border: #d1d9e0; /* item borders */
--faq-color-accent: #0969da; /* links, focus ring */
/* Type */
--faq-font: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
--faq-font-size-base: 1rem;
--faq-line-height: 1.7;
--faq-question-size: 1.125rem;
--faq-title-size: 1.5rem;
/* Spacing scale */
--faq-space-1: 0.25rem;
--faq-space-2: 0.5rem;
--faq-space-3: 1rem;
--faq-space-4: 1.5rem;
/* Radius and shadow */
--faq-radius: 8px;
--faq-shadow: 0 8px 24px rgba(31, 35, 40, 0.08);
}