mirror of
https://github.com/oceanprotocol/market.git
synced 2024-06-26 03:06:49 +02:00
102 lines
2.5 KiB
CSS
102 lines
2.5 KiB
CSS
|
.select [class$='control'] {
|
||
|
border-color: var(--border-color);
|
||
|
border-radius: var(--border-radius);
|
||
|
box-shadow: none;
|
||
|
background-color: var(--background-content);
|
||
|
font-size: var(--font-size-base);
|
||
|
font-family: var(--font-family-base);
|
||
|
font-weight: var(--font-weight-bold);
|
||
|
cursor: text;
|
||
|
min-height: 43px;
|
||
|
}
|
||
|
|
||
|
.select [class$='control']:hover {
|
||
|
border-color: var(--border-color);
|
||
|
}
|
||
|
|
||
|
.select [class$='control']:focus-within {
|
||
|
border-color: var(--font-color-text);
|
||
|
}
|
||
|
|
||
|
.select [class$='ValueContainer'] {
|
||
|
padding: calc(var(--spacer) / 4) calc(var(--spacer) / 3);
|
||
|
}
|
||
|
|
||
|
.select [class$='Input'] {
|
||
|
margin: 0;
|
||
|
padding-bottom: 0;
|
||
|
padding-top: 0;
|
||
|
font-size: var(--font-size-base);
|
||
|
font-family: var(--font-family-base);
|
||
|
font-weight: var(--font-weight-bold);
|
||
|
}
|
||
|
|
||
|
.select input {
|
||
|
color: var(--font-color-heading) !important;
|
||
|
}
|
||
|
|
||
|
.select [class$='menu'] {
|
||
|
background-color: var(--background-highlight);
|
||
|
border-radius: var(--border-radius);
|
||
|
}
|
||
|
|
||
|
.select [class$='option'] {
|
||
|
color: var(--font-color-heading);
|
||
|
font-size: var(--font-size-base);
|
||
|
font-family: var(--font-family-base);
|
||
|
font-weight: var(--font-weight-bold);
|
||
|
}
|
||
|
|
||
|
.select [class$='option']:active {
|
||
|
background-color: var(--color-secondary);
|
||
|
}
|
||
|
|
||
|
.select [class$='multiValue'],
|
||
|
.select [class$='multiValue'] > *,
|
||
|
.select [class$='multiValue']:hover > * {
|
||
|
border-radius: var(--border-radius);
|
||
|
background-color: var(--background-highlight);
|
||
|
color: var(--font-color-text);
|
||
|
font-size: var(--font-size-base);
|
||
|
font-family: var(--font-family-base);
|
||
|
font-weight: var(--font-weight-bold);
|
||
|
padding-top: 0;
|
||
|
padding-bottom: 0;
|
||
|
}
|
||
|
|
||
|
.select [class$='multiValue'] > div[role$='button'],
|
||
|
.select [class$='indicatorContainer'] svg {
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
|
||
|
.select [class$='placeholder'] {
|
||
|
margin-left: 0;
|
||
|
margin-right: 0;
|
||
|
color: var(--color-secondary);
|
||
|
font-weight: var(--font-weight-base);
|
||
|
transition: 0.2s ease-out;
|
||
|
opacity: 0.7;
|
||
|
}
|
||
|
|
||
|
.select [class$='menu'] {
|
||
|
background-color: var(--background-content);
|
||
|
margin-top: -2px;
|
||
|
border: 1px solid var(--font-color-text);
|
||
|
border-top-color: var(--border-color);
|
||
|
border-top-left-radius: 0;
|
||
|
border-top-right-radius: 0;
|
||
|
box-shadow: none;
|
||
|
}
|
||
|
|
||
|
.select [class$='menu'] [class$='option']:hover,
|
||
|
.select [class$='menu'] [class$='option']:focus-within {
|
||
|
background-color: var(--font-color-heading);
|
||
|
color: var(--background-content);
|
||
|
}
|
||
|
|
||
|
.select [class$='NoOptionsMessage'] {
|
||
|
font-size: var(--font-size-small);
|
||
|
color: var(--color-secondary);
|
||
|
text-align: left;
|
||
|
}
|