@wonderflow/react-components/dist/components/snackbar/snackbar.module.css

UI components from Wonderflow's Wanda design system

@layer components{.Snackbar{background:var(--global-background);border:1px solid var(--global-vibrancy-background);border-radius:.5rem;display:block;overflow:hidden;padding:1rem}.Snackbar p{font-size:.875rem}.Snackbar[data-snackbar-kind=neutral]{--heading-foreground:var(--highlight-gray-foreground);--snackbar-bg:var(--highlight-gray-background);--snackbar-fg:var(--highlight-gray-foreground)}.Snackbar[data-snackbar-kind=positive]{--heading-foreground:var(--highlight-green-foreground);--snackbar-bg:var(--highlight-green-background);--snackbar-fg:var(--highlight-green-foreground)}.Snackbar[data-snackbar-kind=warning]{--heading-foreground:var(--highlight-yellow-foreground);--snackbar-bg:var(--highlight-yellow-background);--snackbar-fg:var(--highlight-yellow-foreground)}.Snackbar[data-snackbar-kind=info]{--heading-foreground:var(--highlight-blue-foreground);--snackbar-bg:var(--highlight-blue-background);--snackbar-fg:var(--highlight-blue-foreground)}.Snackbar[data-snackbar-kind=danger]{--heading-foreground:var(--highlight-red-foreground);--snackbar-bg:var(--highlight-red-background);--snackbar-fg:var(--highlight-red-foreground)}.Icon{fill:var(--snackbar-fg);color:var(--snackbar-fg);flex-grow:0;flex-shrink:0;height:1.5rem;margin-top:-.15rem;max-width:1.5rem;width:1.5rem}.Icon[data-snackbar-has-title=true]{margin-top:0}}@layer overrides{.Action{background-color:var(--snackbar-fg);color:var(--snackbar-bg)}.Action:is(:active,:hover){background-color:var(--snackbar-fg);color:var(--snackbar-bg);opacity:.8}}