feat(design-system): Storybook + Button-Atom-Vereinheitlichung + SectionHeader
Storybook (SvelteKit-Framework, Tailwind v4, MSW, Translation-Decorator): Stories für Atoms/Molecules/Organisms + alle CMS-Blocks. Button-Atom: 5 .btn-*-Varianten (primary/secondary/tertiary/outline/warning), class-Merge-Prop, href→<a>, Loading-Spinner neben Label, rounded-md/font-medium. Alle rohen .btn-*- und Hand-Style-Buttons app-weit aufs Atom migriert. SectionHeader-Molecule (kicker/number/title/subtitle/action) + Integration in 7 CMS-Blocks (post_overview, organisations, organisations_map, searchable_text, image_gallery, youtube_video_gallery, files) via neuem section_header-Schema. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
import type { StorybookConfig } from '@storybook/sveltekit';
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
|
||||
const config: StorybookConfig = {
|
||||
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|ts|svelte)'],
|
||||
addons: [
|
||||
'@storybook/addon-svelte-csf',
|
||||
'@storybook/addon-a11y',
|
||||
'@storybook/addon-docs',
|
||||
],
|
||||
framework: '@storybook/sveltekit',
|
||||
// MSW-Service-Worker liegt in static/ (via `npx msw init static/`). Storybook
|
||||
// muss static/ ausliefern, damit /mockServiceWorker.js erreichbar ist.
|
||||
staticDirs: ['../static'],
|
||||
// Tailwind v4 läuft als Vite-Plugin. Das sveltekit-Framework bringt nur die
|
||||
// Svelte/SvelteKit-Integration mit ($app/$env/$lib-Mocks), nicht Tailwind —
|
||||
// darum hier explizit dazuhängen, sonst greifen keine Utility-Klassen/Tokens.
|
||||
viteFinal: async (viteConfig) => {
|
||||
viteConfig.plugins = viteConfig.plugins ?? [];
|
||||
viteConfig.plugins.push(tailwindcss());
|
||||
|
||||
// Same-origin-Routen, die im echten Frontend SvelteKit-Server-Endpoints
|
||||
// sind (in Storybook nicht existieren), auf die Live-Site proxien. Damit
|
||||
// rendern RustyImage-Bilder (/cms-images, /cms-files) und die Live-Daten-
|
||||
// Blocks (/api/strommix, /api/stellungnahme) mit echten Daten — ohne
|
||||
// Fixtures. Deterministische Offline-Mocks stattdessen via MSW (siehe
|
||||
// .storybook/README oder Kommentar unten).
|
||||
const PROXY_TARGET = 'https://windwiderstand.de';
|
||||
viteConfig.server = viteConfig.server ?? {};
|
||||
viteConfig.server.proxy = {
|
||||
...(viteConfig.server.proxy ?? {}),
|
||||
'/cms-images': { target: PROXY_TARGET, changeOrigin: true },
|
||||
'/cms-files': { target: PROXY_TARGET, changeOrigin: true },
|
||||
'/api/strommix': { target: PROXY_TARGET, changeOrigin: true },
|
||||
'/api/stellungnahme': { target: PROXY_TARGET, changeOrigin: true },
|
||||
};
|
||||
return viteConfig;
|
||||
},
|
||||
};
|
||||
export default config;
|
||||
Reference in New Issue
Block a user