Skip to content

Instantly share code, notes, and snippets.

@jackarmley

jackarmley/dabblet.css

Created April 10, 2013 01:02
Show Gist options
  • Save jackarmley/5350858 to your computer and use it in GitHub Desktop.
Save jackarmley/5350858 to your computer and use it in GitHub Desktop.
Download ZIP
Spinning flower
Raw
dabblet.css
/**
* Spinning flower
*/
@-webkit-keyframes flowerspin{
0%{
-webkit-transform:rotate(0deg);
}
100%{
-webkit-transform:rotate(360deg);
}
}
.flower{
position:absolute;
top:50%;
left:50%;
width:100px;
height:100px;
margin:-50px 0 0 -50px;
border-radius:100%;
background:-webkit-radial-gradient(pink 20%,white 100%);
box-shadow:
50px 0 0 5px rgba(20,200,255,.5),
0 50px 0 5px rgba(20,200,255,.5),
-50px 0 0 5px rgba(20,200,255,.5),
0 -50px 0 5px rgba(20,200,255,.5)
;
-webkit-animation:flowerspin 5s infinite linear;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="flower"></div>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment