vcss [EXPERIMENTAL]
Usage
import 'package:vcss/browser.dart' as css;
const addIcon = const css.SvgIcon('add' , '0 0 24 24' ,
const [const css.SvgPath(d: 'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z' )]);
const removeIcon = const css.SvgIcon('remove' , '0 0 24 24' ,
const [const css.SvgPath(d: 'M19 13H5v-2h14v2z' )]);
const oneColor = const css.HexColor('#333' );
const twoColor = const css.HexColor('#555' );
const xSize = const css.Size.px(10 );
borderMixin(color) = > [css.border('1px solid $ color ' )];
class OneCss extends css.StyleSheet {
const OneCss();
static const instance = const OneCss();
final icons = const [addIcon];
build(_) = > [
css.rule('.one' , [
css.color(oneColor)
])
];
}
class TwoCss extends css.StyleSheet {
const TwoCss();
static const instance = const TwoCss();
final icons = const [removeIcon];
build(_) = > [
css.rule('.two' , [
css.color(twoColor)
])
];
}
class ExampleCss extends css.StyleSheet {
const ExampleCss();
static const instance = const ExampleCss();
final require = const [OneCss.instance, TwoCss.instance];
build(_) = > [
css.rule(['#text' ], [
css.background(twoColor),
borderMixin(oneColor),
css.rule('&.sub' , [
css.top(xSize * 2 )
]),
css.rule(['.abc' , '.def' ], [
css.bottom('20px' ),
css.background('#999' )
])
]),
css.keyframes('anim' , [
css.rule('0%' , [
css.bottom('20px' ),
]),
css.rule('100%' , [
css.bottom('40px' ),
])
])
];
}
main() {
final m = new css.StyleSheetManager();
m.include([ExampleCss.instance]);
}