forked from Git/hugo-story
Delete 'assets/sass/components/_button.scss'
This commit is contained in:
parent
367ebc2bcd
commit
a902d2641c
|
@ -1,113 +0,0 @@
|
||||||
/*
|
|
||||||
Hugo Story by CaressOfSteel
|
|
||||||
A (modular, highly tweakable) responsive one-page theme for Hugo.
|
|
||||||
Ported from Story by HTML5UP.
|
|
||||||
This Hugo theme is licensed under the Creative Commons Attribution 3.0 License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Button */
|
|
||||||
|
|
||||||
input[type="submit"],
|
|
||||||
input[type="reset"],
|
|
||||||
input[type="button"],
|
|
||||||
button,
|
|
||||||
.button {
|
|
||||||
@include vendor('appearance', 'none');
|
|
||||||
@include vendor('transition', (
|
|
||||||
'background-color #{_duration(transition)} ease-in-out',
|
|
||||||
'box-shadow #{_duration(transition)} ease-in-out',
|
|
||||||
'color #{_duration(transition)} ease-in-out'
|
|
||||||
));
|
|
||||||
border: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
display: inline-block;
|
|
||||||
font-weight: _font(weight-bold);
|
|
||||||
letter-spacing: _font(kerning-alt);
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
text-transform: uppercase;
|
|
||||||
white-space: nowrap;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
max-width: 20rem;
|
|
||||||
height: 3.75em;
|
|
||||||
line-height: 3.75em;
|
|
||||||
border-radius: 3.75em;
|
|
||||||
padding: 0 2.5em;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
&.icon {
|
|
||||||
&:before {
|
|
||||||
margin-right: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.fit {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.small {
|
|
||||||
font-size: 0.6rem;
|
|
||||||
height: 3.325em;
|
|
||||||
line-height: 3.325em;
|
|
||||||
border-radius: 3.325em;
|
|
||||||
padding: 0 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.large {
|
|
||||||
font-size: 0.8rem;
|
|
||||||
height: 4em;
|
|
||||||
line-height: 4em;
|
|
||||||
border-radius: 4em;
|
|
||||||
padding: 0 3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.wide {
|
|
||||||
min-width: 14em;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.disabled,
|
|
||||||
&:disabled {
|
|
||||||
@include vendor('pointer-events', 'none');
|
|
||||||
opacity: 0.25;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin color-button($p: null) {
|
|
||||||
input[type="submit"],
|
|
||||||
input[type="reset"],
|
|
||||||
input[type="button"],
|
|
||||||
button,
|
|
||||||
.button {
|
|
||||||
background-color: transparent;
|
|
||||||
box-shadow: inset 0 0 0 _size(border-width) _palette($p, border);
|
|
||||||
color: _palette($p, fg-bold) !important;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
|
|
||||||
color: _palette($p, accent) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background-color: transparentize(_palette($p, accent), 0.8);
|
|
||||||
box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
|
|
||||||
color: _palette($p, accent) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.primary {
|
|
||||||
background-color: _palette($p, fg-bold);
|
|
||||||
box-shadow: none;
|
|
||||||
color: _palette($p, bg) !important;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: _palette($p, accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background-color: darken(_palette($p, accent), 12);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include color-button;
|
|
Loading…
Reference in New Issue