Displaying 1 to 20 from 29 results

glamorous - 💄 Maintainable CSS with React

  •    Javascript

With the release of glamorous-primitives, now you can use glamorous with react-sketchapp to manage design systems and use React components for designs.You can find documentation and related examples here.

jss - JSS is an authoring tool for CSS which uses JavaScript as a host language.

  •    Javascript

JSS is a more powerful abstraction over CSS. It uses JavaScript as a language to describe styles in a declarative and maintainable way. It is a high performance JS to CSS compiler which works at runtime and server-side. This core library is low level and framework agnostic. It is about 6KB (minified and gzipped) and is extensible via plugins API. Feel free to ask any JSS related questions on twitter by using hashtag #cssinjs and mentioning @oleg008, watch my latest talk about "Unique Value Proposition of CSSinJS" and try it on a playground.

react-jss - JSS integration for React.

  •    Javascript

React-JSS provides components for JSS as a layer of abstraction. JSS and the default preset are already built in! Try it out in the playground. React-JSS wraps your component with a higher-order component. It injects a classes prop, which is a simple map of rule names and generated class names. It can act both as a simple wrapping function and as an ES7 decorator.

css-in-js - React: CSS in JS techniques comparison

  •    Javascript

React: CSS in JS techniques comparison. More ticks doesn't mean "better", it depends on your needs. For example, if a package supports the css file extraction you can run the autoprefixing at build time.




postcss-js - PostCSS for React Inline Styles, Free Style and other CSS-in-JS

  •    Javascript

PostCSS for React Inline Styles, Radium, JSS and other CSS-in-JS.For example, to use Stylelint, RTLCSS or postcss-write-svg plugins in your workflow.

glamorous-native - React Native component styling solved💄

  •    Javascript

glamorous for React Native. React component styling solved with an elegant (inspired) API, small footprint, and great performance. For full feature documentation, see the glamorous docs. In React Native, we write styles within our JS, but you don't like having to create entire component functions just for styling purposes. You don't want to give a name to something that's purely style-related. And it's kind of annoying to do the StyleSheet.create, conditionals, and props-forwarding song and dance.

styletron-vue - Vue bindings for Styletron.

  •    Javascript

Vue bindings for Styletron.Check out discussion here.


styled-jsx-postcss - Use PostCSS with styled-jsx 💥

  •    Javascript

Install the package first. Also keep in mind that the PostCSS transformations run on styled-jsx transformed code.

vstyle - A lib for managing styles with JavaScript.

  •    TypeScript

This library is still experimental, and have not been used in production project. VStyle is a library for managing styles with JavaScript.

babel-plugin-tailwind - Transform TailwindCSS classes to CSS-in-JS at build time

  •    Javascript

Transforms TailwindCSS classes to CSS-in-JS at build time. Note - Works with CSS-in-JS libraries that accept a style object such as Glamor, Glamorous, Emotion, CXS, etc...

css-vendor - Runtime vendor prefixing based on feature detection.

  •    Javascript

Test if property is supported, returns false if not. Returns string if supported. May add a vendor prefix if needed. Test if value is supported, returns false if not. Returns string if supported. May add a vendor prefix if needed.

cssinjs - JSS documentation site

  •    Javascript

Move the site engine to a separate repo. It can be actually used for any projects. File a bug against cssinjs/jss prefixed with [site].

jss-cache - JSS plugin that caches the rules and delivers insane performance.

  •    Javascript

This plugin will cache virtual rules by checking if a past style object has been already passed. Make sure you read how to use plugins in general.

jss-camel-case - JSS plugin, allows to write styles in camel case.

  •    Javascript

Internally it converts everything back to dash separated names. Make sure you read how to use plugins in general.

jss-default-unit - JSS plugin, adds default units to numeric values.

  •    Javascript

Provide plain numeric values in your JSS style definitions, and the plugin will insert the apposite units. Defaults to px for sizes, ms for durations, and % for transform origins, and these can be customized easily (see Usage Example). Make sure you read how to use plugins in general.

jss-expand - JSS plugin, gives you a better syntax than CSS itself.

  •    Javascript

Can you remember what each of those values mean box-shadow: 2px 2px 2px 1px gold; and in which order they have to be used? Me neither. CSS values are sometimes cryptic. This plugin makes them easy to read and to remember. Make sure you read how to use plugins in general and read full documentation.

jss-extend - JSS plugin that enables mixing in styles.

  •    Javascript

This plugin implements a custom property extend which allows you to mix in styles in various ways. Style object own properties always take precedence over extended objects, so you can always override the extended definition. Exception is function values.