Skip to content

Instantly share code, notes, and snippets.

@angp4o

angp4o/dabblet.css

Created March 21, 2013 09:31
Show Gist options
  • Save angp4o/5211812 to your computer and use it in GitHub Desktop.
Save angp4o/5211812 to your computer and use it in GitHub Desktop.
Download ZIP
Android Robot CSS Only
Raw
dabblet.css
/**
* Android Robot CSS Only
*/
.android{
position: absolute;
top: 150px;
left: 480px;
}
.head{
position: absolute;
width: 300px;
height: 140px;
background-color: red;
border-radius: 180px 180px 0 0;
}
.eyes:before,
.eyes:after{
position:absolute;
content: '';
width: 28px;
height: 28px;
background-color: black;
border-radius: 14px;
top: 55px;
}
.eyes:before{
left: 70px;
}
.eyes:after{
right: 70px;
}
.antenna:before,
.antenna:after{
position: absolute;
content: '';
width: 10px;
height: 50px;
background-color: red;
border-radius: 40px;
top: -35px;
}
.antenna:before{
left: 79px;
-moz-transform:rotate(-20deg);
-webkit-transform:rotate(-20deg);
-o-transform:rotate(-20deg);
-ms-transform:rotate(-20deg);
}
.antenna:after{
right: 79px;
-moz-transform:rotate(20deg);
-webkit-transform:rotate(20deg);
-o-transform:rotate(20deg);
-ms-transform:rotate(20deg);
}
.body{
position: absolute;
width: 300px;
height: 240px;
background-color: red;
top: 152px;
border-radius: 0 0 40px 40px;
}
.arms:before,
.arms:after{
position: absolute;
content: '';
width: 70px;
height: 200px;
background-color: red;
border-radius: 40px;
top: -10px;
}
.arms:before{
left: -82px;
}
.arms:after{
right: -82px;
}
.legs:before,
.legs:after{
position: absolute;
content: '';
width: 70px;
height: 120px;
background-color: red;
border-radius: 0 0 40px 40px;
top: 240px;
}
.legs:before{
left: 52px;
}
.legs:after{
right: 52px;
}
Raw
dabblet.html
<title>Android Robot CSS Only</title>
<body>
<div class="android">
<div class="head">
<div class="eyes"></div>
<div class="antenna"></div>
</div>
<div class="body">
<div class="arms"></div>
<div class="legs"></div>
</div>
</div>
</body>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment