Skip to content

Sch/fix/styling#18

Merged
praisethemoon merged 2 commits intomainfrom
sch/fix/styling
Feb 6, 2026
Merged

Sch/fix/styling#18
praisethemoon merged 2 commits intomainfrom
sch/fix/styling

Conversation

@praisethemoon
Copy link
Collaborator

  1. Fixes classname override in components
  2. Wrap all CSS files with baukasten layer.
  • VanillaExtract CSS is wrapped using a viteplugin (baukasten-base.css)
  • Baukasten variables and tokens are wrapped in source level

Risk level:

  • Low risk (docs, tests, minor fixes)
  • Medium risk (above average work, refactors)
  • High risk (infra, critical changes)

Add className prop to multiple components allowing users to extend
or override styles using clsx for proper class merging:

- Alert: merge custom className with variant styles
- Badge: merge custom className with variant/size/outline styles
- Button: merge custom className with all button variants
- Hero: merge custom className with container styles
- Input: merge custom className with input styles
- StatusBar: merge custom className with item styles
- Table: merge custom className with all table sub-components

Also add Storybook examples demonstrating className merging capabilities.
…ding

Add @layer baukasten wrapper around all component library CSS to ensure
lower specificity than consumer styles. This makes overriding styles
easier without requiring !important or complex selectors.

Changes:
- Add wrapInLayer Vite plugin to wrap vanilla-extract CSS output
- Wrap global styles in @layer in generate-css.ts and css-variables.ts
- CSS variables remain outside the layer (no cascade protection needed)
- Add documentation comments explaining the layer strategy
Copy link
Collaborator

@jonah-iden jonah-iden left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like a great improvement!

@praisethemoon praisethemoon merged commit 75e6977 into main Feb 6, 2026
1 check passed
@praisethemoon praisethemoon deleted the sch/fix/styling branch February 6, 2026 11:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants