1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-06-26 11:16:51 +02:00
market/src/components/Search/sort.module.css
Sebastian Abromeit 8249ff1397
update ui components for mobile (#1495)
* fix mobile layout for filter buttons

* fix tabs component mobile view

* fix zoom in on input focus on mobile devices

* reduce searchbar font-size
2022-06-28 13:55:29 +01:00

59 lines
1.3 KiB
CSS

.sortList {
padding: 0 calc(var(--spacer) / 10);
display: flex;
align-items: center;
border-radius: var(--border-radius);
border: 1px solid var(--border-color);
background: var(--background-content);
overflow-y: auto;
}
@media (min-width: 55rem) {
.sortList {
align-self: flex-end;
overflow-y: unset;
}
}
.sortLabel {
composes: label from '@shared/FormInput/Label.module.css';
margin-bottom: 0;
margin-left: calc(var(--spacer) / 2);
margin-right: calc(var(--spacer) / 1.5);
text-transform: uppercase;
color: var(--color-secondary);
font-size: var(--font-size-small);
}
.sorted {
display: flex;
padding: calc(var(--spacer) / 6) calc(var(--spacer) / 2);
margin-right: calc(var(--spacer) / 4);
color: var(--color-secondary);
text-transform: capitalize;
border-radius: 0;
font-weight: var(--font-weight-base);
background: var(--background-content);
box-shadow: none;
}
.sorted:hover,
.sorted:focus,
.sorted.selected {
color: var(--font-color-text);
background: inherit;
transform: none;
box-shadow: none;
}
.direction {
display: flex;
background: transparent;
border: none;
color: inherit;
font-size: 0.75em;
outline: none;
margin-left: calc(var(--spacer) / 8);
margin-top: calc(var(--spacer) / 14);
}