Skip to content

Instantly share code, notes, and snippets.

@ilyabrin

ilyabrin/dabblet.css

Created December 18, 2011 19:56
Show Gist options
  • Save ilyabrin/1494285 to your computer and use it in GitHub Desktop.
Save ilyabrin/1494285 to your computer and use it in GitHub Desktop.
Download ZIP
CSS Pink Button Transformation v.0.0.1
Raw
dabblet.css
/**
* CSS Pink Button Transformation v.0.0.1
*/
body {
padding: 20px;
font: 54px/58px Futura, Helvetica, Arial, sans-serif;
color: white;
-webkit-transform: perspective(750);
-webkit-transform-style: preserve-3d;
margin: 0;
}
a.button {
display: block;
text-decoration: none;
margin: 30px auto 0px auto;
width: 300px;
color: #fff;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
background: #EF5C91;
background: -moz-linear-gradient(top, #EF5C91, #D82A49);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EF5C91), to(#D82A49));
text-align: center;
font-size: 24px;
line-height: 27px;
padding: 16px;
border: 2px solid #F372AB;
text-shadow: rgba(0, 0, 0, 0.496094) 0px -1px 1px;
-webkit-box-shadow: 0px 0px 50px #f372ab;
-webkit-transform: scale(0.95);
-webkit-transition: -webkit-transform 0.5s;
}
a.button:hover {
-webkit-transform: scale(1);
-webkit-transition: -webkit-transform 0.5s;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<a class="button" href="http://www.google.com/">
<span style="font-size:14px;line-height:19px;display:block;margin-bottom:10px">
HTML5 + CSS3 + JS<br>
Smolget: Валютный рынок и ценные бумаги </span>
3000 рублей всего за $99
</a>
Raw
settings.json
{"page":"html","view":"split-vertical"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment