css-enums
v1.0.4
Published
Typescript enums for css properties
Downloads
24
Maintainers
Readme
CSS Enums
Typescript library aimed to provide enumerables for CSS properties mostly for CSSInJS utilities. Based on type definitions from csstype (v3.0.5) lib.
Installation
Install with npm:
npm install css-enums
Install with yarn:
yarn add css-enums
Usage
CSS in JS example (with JSS lib):
import { Border, Cursor, Color, BoxSizing, Width, Height, TextTransform } from 'css-enums';
yourClassName: {
width: Width.Inherit,
height: Height.Inherit,
border: [1, Border.Solid, Color.Red],
borderWidth: [0, 0, 1, 0],
boxSizing: BoxSizing.BorderBox,
padding: [4, 8],
textTransform: TextTransform.Capitalize,
cursor: Cursor.Pointer
}
// or import everything:
import * as CSS from 'css-enums';
yourClassName: {
width: CSS.Width.Inherit,
height: CSS.Height.Inherit,
border: [1, CSS.Border.Solid, CSS.Color.Red],
borderWidth: [0, 0, 1, 0],
boxSizing: CSS.BoxSizing.BorderBox,
padding: [4, 8],
textTransform: CSS.TextTransform.Capitalize,
cursor: CSS.Cursor.Pointer
}
Styles assignment in JS:
import { Display } from 'css-enums';
htmlElement.style.display = Display.None;
// notice: afterwards typescript inlines every enum:
htmlElement.style.display = 'none';