- 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
29 lines
928 B
CSS
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);
|
|
}
|