Skip to content

Instantly share code, notes, and snippets.

@kimroen

kimroen/dabblet.css

Created March 26, 2013 11:10
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 kimroen/5244633 to your computer and use it in GitHub Desktop.
Save kimroen/5244633 to your computer and use it in GitHub Desktop.
Download ZIP
Pido-knapp
Raw
dabblet.css
/**
* Pido-knapp
* The first commented line is your dabblet’s title
*/
html {
background: linear-gradient(top, white, hsl(0,0%,95%)) no-repeat;
min-height: 100%;
font-family: sans-serif;
}
section {
height: 200px;
width: 200px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -100px;
margin-top: -100px;
}
a {
display: inline-block;
box-sizing: border-box;
color: hsl(0,0%,95%);
text-align: center;
height: 40px;
line-height: 40px;
width: 100px;
cursor: pointer;
border: 2px solid hsl(0,0%,4%);
border-radius: 22px;
-moz-background-clip: padding;
background-clip: padding-box; /* prevents bg color from leaking outside the border */
background-color: hsl(0,0%,4%);
box-shadow: inset 0 0 0 2px hsl(0,0%,95%);
letter-spacing: .04em;
}
a:hover {
background-color: hsl(0,0%,95%);
color: hsl(0,0%,4%);
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<section><a class="reservo-button">Go forth!</a></section>
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