Mithril have a nice companion Bss which is a CssInJS library.
Look at what can be achieved with those guys (thanks to Osban and Porsager)
b.css("body", b `bc black`)
b.helper({
rel: b `position relative`,
pos: (l, t) => b.l(l).t(t || t === 0 ? t : l),
size: (w, h) => b.w(w).h(h || h === 0 ? h : w)
})
const Digit = () => {
let index = 0
const lightOn = 'rgba(0, 255, 0, 1)'
const lightOff = 'rgba(0, 255, 0, 0.30)'
const code = [0x3F, 0x06, 0x5B, 0x4F, 0x66, 0x6D, 0x7D, 0x07, 0x7F, 0x6F]
const size = ['100 10', '10 100', '10 100', '100 10', '10 100', '10 100', '100 10']
const pos = ['0 10', '100 10', '100 20', '0 20', '-10 -90', '-10 -300', '0 -300']
const style = x => b `size ${size[x]}; rel; pos ${pos[x]}; br 50`
const light = x => code[index] >> x & 1
setInterval(() => {
index++;
index %= 10;
m.redraw()
}, 1000)
return {
view: () =>
m("" + b `h 100; transform scale(0.5); h 250; w 120`,
[...new Array(7).keys()].map(x =>
m("" + style(x) + b.bc(light(x) ? lightOn : lightOff))
)
)
}
}
m.mount(root, Digit)
You can play with it here : 7LED