unit.styl
...makes it easy to convert relative and absolute units. Use the unit of your choice and don't worry about it.
See docs.
install
Just clone this project, or download it via npm.
$ npm install unit-styl
--save
or--save-dev
flags are recommended.
JavaScript API
var stylus = unit = ; { return ;}
Stylus API
@import 'unit'
You can also import individual parts:
@import 'unit/_angle'@import 'unit/_length'@import 'unit/_resolution'@import 'unit/_time'
The just-use-it way
@import 'node_modules/unit-styl/unit'
Check whether the
node_modules
path is correct.
documentation
→ relative ⇔ absolute
Relative units can be absolute and absolute units can be relative! :-)
A context is required for relative units (
rem
,%
). Only conversions betweenpx
⇔pt
don't require context.
EXAMPLE 1 (no context needed)
EXAMPLE 2
EXAMPLE 3
Tip: You can do fallbacks for IE to rem
unit printing the results in pixels too, e.g. px(1.5rem)
--
deg
⇔ rad
⇔ turn
⇔ grad
→ angles: EXAMPLE 1
)); /* transform: rotateY(180deg) */
EXAMPLE 2
)); /* transform: rotateX(3.14rad); */
--
ms
⇔ s
→ time: EXAMPLE 1
); /* transition-duration: 500ms */
EXAMPLE 2
); /* transition-duration: 0.5s; */
sec()
takes a second parameter:leadingzero
, an optional boolean -true
by default. Iffalse
, leading zero is omitted.
); /* transition-duration: .5s; */