You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
1022 B
SCSS
66 lines
1022 B
SCSS
@import './mixins.scss';
|
|
|
|
//
|
|
// Controls - for things like buttons, input, select
|
|
//
|
|
|
|
button,
|
|
.button,
|
|
[role='button'] {
|
|
appearance: none;
|
|
|
|
background: #fff;
|
|
|
|
@include neo-brutalist-card;
|
|
|
|
transition: all 64ms linear;
|
|
|
|
&:hover {
|
|
transform: translate(-1px, -1px);
|
|
box-shadow: 5px 5px 0 0 #222;
|
|
}
|
|
|
|
&:active {
|
|
transform: translate(2px, 2px);
|
|
box-shadow: 2px 2px 0 0 #222;
|
|
}
|
|
|
|
padding: 0.25rem 1.5rem;
|
|
|
|
text-decoration: none;
|
|
color: #222;
|
|
|
|
font-family: 'Source Sans Pro', sans-serif;
|
|
font-weight: 600;
|
|
|
|
cursor: pointer;
|
|
|
|
&.primary {
|
|
background: #1e6733;
|
|
color: #f4fef7;
|
|
|
|
&:hover {
|
|
background: #2b8b47;
|
|
}
|
|
}
|
|
|
|
&.icon {
|
|
padding: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
}
|
|
|
|
input[type='text'] {
|
|
width: 100%;
|
|
height: 2.5rem;
|
|
|
|
@include neo-brutalist-card;
|
|
|
|
padding: 0 0.25rem;
|
|
|
|
&:hover {
|
|
background: #fdfdfd;
|
|
}
|
|
}
|