CSSConf App

Note: This is totally fake and just used as a demo for my "Styling with STRINGS" talk at CSSConf AU 2014.

 

If you have seen the talk and wanna play around a bit with the Flexbox reordering or color and font-size changing, you can do that in the:

Live Demo

Note: The loading can take a while since the app is not optimized for production. That way it's easier to understand the source.

How to customize

Just open the inspector/DevTools and start by changing these properties for the root html element:

html {
    font-size: 16px;
    color: hsl(212, 72%, 80%);
    background: coral;
}

or limit it to the header/footer .Bars only,

.Bar {
    font-size: ???;
    color: ???;
    background: ???;
}

or any other element.

Made with

The app uses the Digit UI Set that runs on MontageJS

Support

Should work in most browsers, although the animations are only WebKit prefixed