lbry-desktop/ui/scss/component/_claim-search.scss
jessopb 3034f4ce6c
bring in styles (#7542)
* bring in ody styles; modify; cleanup

* workflow

* workflow

* v0.52.6-alpha.teststyles.1

* fix hook

* v0.52.6-alpha.teststyles.2

* style fixes

* fix pagination styling

* v0.52.6-alpha.teststyles.3

* wallet icon was bad

* restore deploy script

* fixes

* fix player close button

* modal inputs

* cleanup

* cleanup

* fix staked indicator

* fix profile menu button skel delay

* fix view-all-playlists hover

* fix overlay buttons on collection page

* fix header buttons
2022-04-17 13:04:56 -04:00

132 lines
2.4 KiB
SCSS

.claim-search__wrapper {
width: 100%;
@media (min-width: $breakpoint-small) {
width: auto;
}
}
.claim-search__menus {
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: flex-start;
padding: var(--spacing-m);
padding-left: 0px;
padding-bottom: var(--spacing-s);
margin-top: var(--spacing-m);
margin-bottom: var(--spacing-m);
color: var(--color-text-subtitle);
align-items: flex-start;
@media (min-width: $breakpoint-small) {
flex-direction: row;
}
@media (max-width: $breakpoint-small) {
padding: unset;
}
}
.claim-search__dropdown {
font-size: var(--font-body);
background-color: var(--color-card-background);
background-position: right var(--spacing-m) center;
}
.claim-search__dropdown--selected {
color: var(--color-primary-contrast);
background-color: var(--color-brand-blue);
}
.claim-search__input-container {
display: flex;
flex-direction: column;
font-size: var(--font-body);
width: 100%;
&:not(:first-of-type) {
margin-top: var(--spacing-s);
}
@media (min-width: $breakpoint-small) {
width: auto;
&:not(:first-of-type) {
margin-top: 0;
padding-left: var(--spacing-m);
}
}
}
.claim-search__dropdown,
.claim-search__input-container {
@media (max-width: $breakpoint-small) {
padding-right: 0;
}
}
.claim-search__filter-button {
display: flex;
justify-content: center;
align-items: center;
padding: 0;
}
.claim-search__input-special {
font-weight: var(--font-weight-bold);
}
.claim-search__extra {
display: flex;
align-items: center;
}
.claim-search__top {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
@media (min-width: $breakpoint-small) {
justify-content: flex-start;
}
.claim-search__menu-group:last-of-type {
margin-right: unset;
}
}
.claim-search__top > div {
@media (max-width: $breakpoint-small) {
margin-bottom: var(--spacing-xxs);
}
}
.claim-search__menu-group {
display: flex;
flex-wrap: nowrap;
margin-right: var(--spacing-s);
@media (max-width: $breakpoint-small) {
margin-right: 0;
.button-toggle {
padding: 0 var(--spacing-s) 0 var(--spacing-xs);
}
}
}
.claim-search__menu-group--between {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
width: 100%;
&:last-of-type {
.button-toggle:last-of-type {
margin-right: 0;
}
}
}
.claim-search__tags-link {
margin-left: var(--spacing-s);
}