Rucksack makes CSS development fun again, with features the language should have come with out of the box. It's built on PostCSS, it's modular, it doesn't add any bloat, and it's lightning fast.
.foo {
font-size: responsive;
}
/* Resize your browser! */
.foo {
position: absolute 0;
}
.bar {
position: relative 20% auto;
}
li:at-most(4) {
color: blue;
}
li:at-least(5) {
color: red;
}
input[type="range"]::thumb {
background: blue;
}
.foo {
clear: fix;
}
@font-face {
font-family: 'My Font';
font-path: '/my/font/file';
font-weight: normal;
font-style: normal;
}
.foo {
color: rgba(#fff, 0.8);
}
@alias {
fs: font-size;
fw: font-weight;
}
.foo {
fs: 16px;
fw: bold;
}
.foo {
transition: ease-in-cubic;
}
.bar {
transition: ease-out-back;
}
.foo {
opacity: 0.8;
}
/* Becomes */
.foo {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
opacity: 0.8;
}
.foo {
transition: all;
}
/* Becomes (from CanIUse) */
.foo {
-webkit-transition: all;
transition: all;
}