Skip to content

Instantly share code, notes, and snippets.

@voodoo6

voodoo6/dabblet.css

Created June 21, 2012 10:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save voodoo6/2965005 to your computer and use it in GitHub Desktop.
Save voodoo6/2965005 to your computer and use it in GitHub Desktop.
Download ZIP
helloU facebook button
Raw
dabblet.css
/**
* helloU facebook button
*/
.button {
width:380px;
height:60px;
display: block;
font-size: 30px;
font-weight: bold;
color: #fff;
text-align: center;
line-height: 60px;
text-shadow: 0 1px 1px rgba(0,0,0,.7); /* drop shadow */
border-radius: 15px;
-moz-border-radius: 18px; /* from vector shape */
-webkit-border-radius: 18px; /* from vector shape */
border-radius: 18px; /* from vector shape */
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box; /* prevents bg color from leaking outside the border */
background-color: #6b87b5; /* layer fill content */
-moz-box-shadow:
inset 0 1px 0 rgba(255,255,255,.4) /* inner shadow */,
0 0 0 1px #2c456b /* outer stroke */;
-webkit-box-shadow:
inset 0 1px 0 rgba(255,255,255,.4) /* inner shadow */,
0 0 0 1px #2c456b /* outer stroke */;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.4) /* inner shadow */,
0 0 0 1px #2c456b /* outer stroke */;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+PGxpbmVhckdyYWRpZW50IGlkPSJoYXQwIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjEwMCUiIHgyPSI1MCUiIHkyPSIwJSI+CjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMzNTUxN2YiIHN0b3Atb3BhY2l0eT0iMSIvPgo8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2OTg1YjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICA8L2xpbmVhckdyYWRpZW50PgoKPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+); /* gradient fill */
background-image: -moz-linear-gradient(90deg, #35517f 0%, #6985b3 100%); /* gradient fill */
background-image: -o-linear-gradient(90deg, #35517f 0%, #6985b3 100%); /* gradient fill */
background-image: -webkit-linear-gradient(90deg, #35517f 0%, #6985b3 100%); /* gradient fill */
background-image: linear-gradient(90deg, #35517f 0%, #6985b3 100%); /* gradient fill */
}
​
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
​<a class="button">SignUp with Facebook</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
Raw
settings.json
{"view":"split-vertical","fontsize":"90","seethrough":"","prefixfree":"","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment