Skip to content

Instantly share code, notes, and snippets.

@x-raizor

x-raizor/dabblet.css

Last active October 22, 2015 12:41
Show Gist options
  • Save x-raizor/fa5ca08d1bba8ddfe735 to your computer and use it in GitHub Desktop.
Save x-raizor/fa5ca08d1bba8ddfe735 to your computer and use it in GitHub Desktop.
Download ZIP
Button hover appearance test
Raw
dabblet.css
/**
* Button hover appearance test
*/
html {
text-align: center;
font-family: Proxima Nova, san-serif;
background: #f06;
background: url('http://d.pr/i/10AsQ+');
min-height: 100%;
}
button.button {
top: 50%;
/* Rectangle 65 Copy: */background: #EB3131;border-radius: 6px;
border: none;
height: 50px;
width: 302px;
margin: 5em auto 0;
border-radius: 6px;
color: #fff;
font-size: 23px;
-webkit-transition: all 0.3s; /* Safari 3.1 to 6.0 */
transition: all 0.3s;
}
button.button:hover {
/* Rectangle 65 Copy: */background-image: linear-gradient(-180deg, #EB3131 0%, #C21111 100%);border-radius: 6px;border-radius: 6px;
-webkit-transition: all 0.3s; /* Safari 3.1 to 6.0 */
transition: all 0.3s;
}
button.button:active{
/* Rectangle 65 Copy: */background-image: linear-gradient(-180deg, #911212 0%, #D91818 10%, #EC3333 100%);border-radius: 6px;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<button class="button">Кнопарик</button>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split","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