Skip to content

Instantly share code, notes, and snippets.

@lnazarit

lnazarit/buttons.css

Last active April 12, 2016 14:17
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lnazarit/408a87d9ef0fc2b357d9214d7ba96c63 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lnazarit/408a87d9ef0fc2b357d9214d7ba96c63 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
buttons.css
/* Reset all property button */
.btn {
font-size: 16px;
padding: 10px 20px;
border: 0;
background: none;
filter: none;
border: 1px solid transparent;
box-shadow: none;
text-shadow: none;
border-radius: 0;
display: inline-block;
}
.btn-small {
padding: 7px 15px;
font-size: 13px;
}
.btn-large {
padding: 20px 40px;
font-size: 18px;
}
.btn-default {
color: #000;
background: #f4f4f4;
border-color: #DDD;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
color: #000;
background: #EEE;
border-color: #DDD;
}
.btn-primary {
background: red;
color: #FFF;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
background: orange;
color: #FFF;
}
.btn-transparent {
background: none;
border: 3px solid #000;
color: #000;
}
.btn-transparent:hover,
.btn-transparent:focus,
.btn-transparent:active {
color: #000;
background: none;
}
.btn-transparent-invert {
background: none;
border: 3px solid #FFF;
color: #FFF;
}
.btn-transparent-invert:hover,
.btn-transparent-invert:focus,
.btn-transparent-invert:active {
color: #FFF;
background: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment