Skip to content

Instantly share code, notes, and snippets.

@sthembi

sthembi/dabblet.css

Created October 20, 2012 16:27
Show Gist options
  • Save sthembi/3923841 to your computer and use it in GitHub Desktop.
Save sthembi/3923841 to your computer and use it in GitHub Desktop.
Download ZIP
CSS3 borders and box-shadow experiment - passport
Raw
dabblet.css
/**
* CSS3 borders and box-shadow experiment - passport
*/
body {
/*background: #f06;
background: linear-gradient(45deg, #f06, yellow);*/
min-height: 100%;
}
button {margin:40px;}
button.css3button {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #050505;
padding: 300px 200px;
background: -moz-linear-gradient(
top,
#ffffff 0%,
#ebebeb 50%,
#dbdbdb 50%,
#b5b5b5);
background-color: #AEC5D0;
/*background: -webkit-gradient(
linear, left top, left bottom,
from(#ffffff),
color-stop(0.50, #ebebeb),
color-stop(0.50, #dbdbdb),
to(#b5b5b5));*/
-moz-border-radius: 0px 10px 8px 0px;
-webkit-border-radius: 0px 10px 8px 0px;
border-radius: 0px 20px 18px 0px;
/* border: 2px solid #949494;
*/
border-top:1px solid #949494;
border-right: 3px double #CFCBCB;
border-bottom: 2px double #949494;
border-left:1px solid black;
/* outline: 0px 5px 5px 0px solid hsl(1, 20%, 60%);
*/
box-shadow: 4px 2px 10px 6px rgba(7, 6, 6, 0.1),
4px 2px 8px 5px rgba(7, 6, 6, 0.1),
4px 2px 3px 0px rgba(7, 6, 6, 0.6),
inset -6px -1px 7px rgba(148, 138, 148, 0.1),
/*TODO inset check */
inset -6px -5px 7px rgba(148, 138, 148, 0.5);
text-shadow:
0px -1px 0px rgba(000,000,000,0.2),
0px 1px 0px rgba(255,255,255,1);
}​
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<button type="button" name="" value="" class="css3button">submit</button>​
Raw
settings.json
{"view":"split-vertical","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