Made Select component to make using styled selects easier

This commit is contained in:
Henry Jameson 2021-03-11 16:11:44 +02:00
parent 6281241b92
commit c6d4c20982
19 changed files with 240 additions and 317 deletions

View file

@ -187,7 +187,7 @@ a {
}
}
input, textarea, .select, .input {
input, textarea, .input {
&.unstyled {
border-radius: 0;
@ -217,11 +217,7 @@ input, textarea, .select, .input {
hyphens: none;
padding: 8px .5em;
&.select {
padding: 0;
}
&:disabled, &[disabled=disabled] {
&:disabled, &[disabled=disabled], &.disabled {
cursor: not-allowed;
opacity: 0.5;
}
@ -239,25 +235,6 @@ input, textarea, .select, .input {
pointer-events: none;
}
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: none;
color: $fallback--text;
color: var(--inputText, --text, $fallback--text);
margin: 0;
padding: 0 2em 0 .2em;
font-family: sans-serif;
font-family: var(--inputFont, sans-serif);
font-size: 14px;
width: 100%;
z-index: 1;
height: 28px;
line-height: 16px;
}
&[type=range] {
background: none;
border: none;
@ -809,13 +786,6 @@ nav {
}
}
.select-multiple {
display: flex;
.option-list {
margin: 0;
padding-left: .5em;
}
}
.setting-list,
.option-list{
list-style-type: none;