69 lines
1.6 KiB
Text
69 lines
1.6 KiB
Text
|
|
// ----------------------------------
|
|
// Base style.
|
|
// ----------------------------------
|
|
|
|
|
|
.button {
|
|
display: inline-block;
|
|
padding: 0.5rem 2rem;
|
|
cursor: pointer;
|
|
vertical-align: middle;
|
|
// Resets for <button> elements.
|
|
border: 1px solid transparent;
|
|
transition: all .2s ease-in-out;
|
|
|
|
&:active,
|
|
&:hover {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
&.disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
}
|
|
|
|
// ----------------------------------
|
|
// Variants
|
|
// ----------------------------------
|
|
|
|
|
|
// Round button
|
|
// ----------------------------------
|
|
|
|
.button-round {
|
|
padding: 0;
|
|
.button-circle(40px);
|
|
}
|
|
|
|
// Colors
|
|
// ----------------------------------
|
|
|
|
.button-default { .button-variant(@text-color, @button-bg-color); }
|
|
.button-primary { .button-variant(@button-primary-color, @button-primary-bg); }
|
|
.button-brand { .button-variant(@button-brand-color, @button-brand-bg); }
|
|
.button-light { .button-variant(@text-light-color, @button-bg-color, @button-hover-color); }
|
|
|
|
.button-github { .button-variant(@button-github-color, @button-github-bg); }
|
|
.button-gitlab { .button-variant(@button-gitlab-color, @button-gitlab-bg); }
|
|
.button-google { .button-variant(@button-google-color, @button-google-bg); }
|
|
|
|
// Outline
|
|
// ----------------------------------
|
|
|
|
.button-outline-primary { .button-outline-variant(@text-color, @button-bg-color); }
|
|
|
|
// Sizes
|
|
// ----------------------------------
|
|
|
|
.button-large { font-size: @text-size-large; }
|
|
.button-small { font-size: 0.6em; }
|
|
|
|
// Block button
|
|
// ----------------------------------
|
|
|
|
.button-block {
|
|
display: block;
|
|
width: 100%;
|
|
}
|