Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $
You can buy this project and download/modify it how often you want.
www.reboot.css.src.buttons.styl Maven / Gradle / Ivy
/*! buttons
-----------------------------*/
button,
.nf-button {
margin: 5px;
font-family: inherit;
font-size: 100%;
padding: 0.5em 1em;
color: #333;
background-color: #fff;
border: 1px solid #c4c4c4;
text-decoration: none;
text-transform: none;
border-radius: 4px;
overflow: visible;
display: inline-block;
line-height: normal;
white-space: nowrap;
vertical-align: baseline;
text-align: center;
cursor: pointer;
-webkit-user-drag: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
button::-moz-focus-inner {
padding: 0;
border: 0;
}
.nf-btn-hover,
.nf-button:hover,
.nf-button:focus,
button:hover,
button:focus,
grouped label:hover,
grouped label:focus,
nf-group label:hover,
nf-group label:focus,
grouped input[type=radio]:checked + label,
.nf-group input[type=radio]:checked + label,
grouped input[type=checkbox]:checked + label,
.nf-group input[type=checkbox]:checked + label {
background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.10));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.10));
background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.10));
}
.nf-button-active,
.nf-button:active,
button:active,
grouped label:active,
nf-group label:active,
grouped input[type=radio]:checked + label,
.nf-group input[type=radio]:checked + label,
grouped input[type=checkbox]:checked + label,
.nf-group input[type=checkbox]:checked + label {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 0 6px rgba(0, 0, 0, 0.20) inset;
}
.nf-button:focus,
button:focus {
outline: 0;
}
.nf-button[disabled],
button[disabled],
.is-disabled,
.is-disabled:hover,
.is-disabled:focus,
.is-disabled:active {
background-image: none;
opacity: 0.40;
cursor: default;
box-shadow: none;
pointer-events: none;
}
.btn-primary,
.btn-success,
.btn-error {
color: #fff !important;
border: 1px solid rgba(0, 0, 0, 0.2) !important;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-primary nf-icon,
.btn-success nf-icon,
.btn-error nf-icon {
color: #fff !important;
}
.btn-primary {
background-color: #478CC8 !important;
}
.btn-success {
background: #8DAC71 !important;
}
.btn-classic {
background-color: #E6E6E6 !important;
}
.btn-error {
background: #B6272B !important;
}
/*! grouped buttons
-----------------------------*/
grouped,
.nf-group {
display: inline-block;
margin: 5px;
vertical-align: middle;
}
grouped label,
.nf-group label {
font-family: inherit;
font-size: 100%;
padding: 0.5em 1em;
color: #333;
background-color: transparent;
border: 1px solid #c4c4c4;
text-decoration: none;
display: inline-block;
line-height: normal;
white-space: nowrap;
vertical-align: baseline;
text-align: center;
cursor: pointer;
-webkit-user-drag: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
grouped button,
grouped .nf-buton,
grouped label,
.nf-group button,
.nf-group .nf-buton,
.nf-group label {
border-radius: 0;
margin: 0;
float: left;
border-left-width: 0;
}
grouped button:first-child,
grouped .nf-buton:first-child,
grouped label:first-of-type,
.nf-group button:first-child,
.nf-group .nf-buton:first-child,
.nf-group label:first-of-type {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
border-left-width: 1px;
}
grouped button:last-child,
grouped .nf-buton:last-child,
grouped label:last-of-type,
.nf-group button:last-child,
.nf-group .nf-buton:last-child,
.nf-group label:last-child {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
/*! radio/checkbox buttons
-----------------------------*/
grouped input[type=radio],
.nf-group input[type=radio],
grouped input[type=checkbox],
.nf-group input[type=checkbox] {
display: none;
}
