UNPKG

emile

Version:

no-thrills stand-alone CSS animation JavaScript framework

79 lines 1.24 kB
body { width: 650px; margin: 20px auto; font: 300 16px 'helvetica neue', helvetica, arial; text-shadow: 0 2px 2px #ccc; } h1 { font-size: 30px; font-weight: 300; } ol,li { list-style: none; } ol { -moz-box-shadow: 0 0 5px #ccc; -moz-border-radius: 5px; -webkit-box-shadow: 0 0 5px #ccc; -webkit-border-radius: 5px; box-shadow: 0 0 5px #ccc; border-radius: 5px; padding: 10px; } li { margin: 3px 5px; padding: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; overflow: hidden; } ol > li { opacity: 0; cursor: pointer; } li span { color: #aaa; text-align: right; display: inline-block; float: right; } li.fail span { color: red; } li.pass span { color: green; } li.fail { background-color: #eed5d2; } li.pass { background-color: #bdfcc9; } li.pass, li.fail { -webkit-transition: opacity .5s linear; opacity: 1; } li ul { height: 0; overflow: hidden; margin: 0; padding: 0; list-style: none; } li.pass ul.show { -webkit-box-shadow: 0 0 5px green; } li.fail ul.show { -webkit-box-shadow: 0 0 5px red; } li ul.show { height: auto; padding: 5px; -webkit-border-radius: 5px; margin: 5px; } li ul li { padding: 0; margin: 2px 0; list-style: none; }