Kristóf Poduszló

## Motivation Recently, [otion](https://github.com/kripod/otion), a featherweight atomic CSS library [has been released](https://twitter.com/kripod97/status/1262101505383059456). I built it to make convenient style management possible with a minimalistic runtime. Contrary to treat, it injects...

Optimize statically generated styles by removing unused rules

2

## Motivation Due to the nature of the `sx` function, unused class names cannot be filtered out from the final bundle with tools like [DropCSS](https://github.com/leeoniya/dropcss). Tailwind CSS has a similar...

`sx` prop transform doesn't work with spread attributes

1

## Description A `className` contained in a spread attribute is not taken into account by the Babel transform. ## Reproduction A [new fixture](https://github.com/kripod/glaze/blob/f4cfa8ce557aa010576973757a3ce57d94839c8a/packages/babel-plugin-glaze/tests/fixtures/spread-attributes/code.jsx) has also been added. ```jsx function Component(props)...

Babel plugin to transform a custom `sx` prop for any component

4

## Motivation Calling the `useStyling` hook is verbose, especially for small components, e.g.: ```jsx import { useStyling } from 'glaze'; export default function Component() { const sx = useStyling(); return...

Color schemes

2

## Motivation As [foreshadowed in 2018](https://css-tricks.com/dark-modes-with-css/), dark mode has taken over the web, Not only does it create a new aesthetic twist for websites, but it also serves better accessibility....

## Motivation As the library grows in complexity, tests are required to ensure that nothing breaks over frequent changes. ## Details Use Jest and react-testing-library for implementation.

Autoprefixing in runtime

7

## Motivation As popular CSS-in-JS libraries like [Styled Components](https://github.com/styled-components/styled-components) and [Emotion](https://github.com/emotion-js/emotion) have runtimes, they also do vendor prefixing on the fly. ## Details Consider using [`Stylis v4`](https://github.com/thysultan/stylis.js/pull/195), [`@emotion/stylis`](https://github.com/emotion-js/emotion/tree/master/packages/stylis) or [`css-vendor`](https://github.com/cssinjs/css-vendor).

## Motivation As outlined in https://github.com/seek-oss/treat/issues/97, some theming tokens are useful during runtime. Currently, the [list of shared tokens](https://github.com/kripod/glaze/blob/911e52a15e9114b327fec786b95363a8ec34949a/packages/glaze/src/theme.ts#L46) is hard-coded and thus, not alterable. For highly dynamic styling with...

## Motivation Pseudo selectors and media queries are an important part of CSS, but cannot be inlined with `style` props. ## Details As a solution, a `` element with deterministic...

## Motivation Styled System has introduced [array-based responsive](https://styled-system.com/responsive-styles) styling, reducing the burden caused by manually written media queries. ## Details To avoid confusion between the array and object notation, `undefined`...