You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
To clarify the Fluffy research: styling is a hard topic, because there are tons of ways to do it. I believe these are the goals of Fluffy:
Quite certain
styled via static classes only, no inline styles or runtime-generated classes
somewhat opinionated but easy to theme
As little runtime as possible, ideally just wrapping the headless kit + some classnames, possibly providing some variants
Provides optional pre-built CSS. If that grows beyond 10KB, think about splitting it. (consider using @layer etc)
Mostly certain
uses atomic CSS (class per rule) and uses TailWind-compatible classnames. This allows the consumer to use the static CSS, or use TW or Uno or other TW-compatible frameworks.
For type safety, uses Panda-like utility functions to generate the classnames, with macro support so they convert to strings at build time. The built components won't import those functions.
The pre-built CSS has CSS-variable based theming
Somewhat certain
a Panda flavor might exist too
Installing happens Shadcn-like: You get a copy of the components in your project so you can easily change them. Perhaps 2 versions: A straight re-export, and a copy of the component file.
Therefore try to keep the code to a single file per component.
Basically, the "contract" is at the level of semi-standard classnames, which allows theming freely.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
To clarify the Fluffy research: styling is a hard topic, because there are tons of ways to do it. I believe these are the goals of Fluffy:
Quite certain
@layer
etc)Mostly certain
Somewhat certain
Basically, the "contract" is at the level of semi-standard classnames, which allows theming freely.
Beta Was this translation helpful? Give feedback.
All reactions