DebaucheryLibrarian
/
traxxx
2
1
Fork 1
Code Issues 37 Pull Requests 1 Releases Wiki Activity

Realigned filter bar for mobile.

This commit is contained in:
ThePendulum 2020-01-09 02:03:47 +01:00
parent 7cbb5a2301
commit ae5da770cf
2 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
assets/components/header/filter-bar.vue
View File

@ -45,16 +45,18 @@
</span> </span>
<span> <span>
<Icon icon="filter" /> <span class="filters-container">
<Icon icon="filter" />
<Filters <Filters
class="filters-container" class="filters-block"
:filter="filter" :filter="filter"
@set-filter="setFilter" @set-filter="setFilter"
/> />
</span>
<v-popover class="filters-compact"> <v-popover class="filters-compact">
<div>Filters</div> <Icon icon="filter" />
<div slot="popover"> <div slot="popover">
<Filters <Filters
@ -122,6 +124,7 @@ export default {
background: $background; background: $background;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center;
padding: .5rem 1rem; padding: .5rem 1rem;
z-index: 1; z-index: 1;
font-size: 0; font-size: 0;
@ -136,6 +139,10 @@ export default {
display: inline-block; display: inline-block;
} }
.filters-block {
display: inline-block;
}
.filters-compact { .filters-compact {
font-size: 1rem; font-size: 1rem;
font-weight: bold; font-weight: bold;

5
public/css/style.css
View File

@ -48,6 +48,8 @@
display: flex; display: flex;
-webkit-box-pack: justify; -webkit-box-pack: justify;
justify-content: space-between; justify-content: space-between;
-webkit-box-align: center;
align-items: center;
padding: .5rem 1rem; padding: .5rem 1rem;
z-index: 1; z-index: 1;
font-size: 0; font-size: 0;
@ -59,6 +61,9 @@
.filters-container[data-v-6db17c96] { .filters-container[data-v-6db17c96] {
display: inline-block; display: inline-block;
} }
.filters-block[data-v-6db17c96] {
display: inline-block;
}
.filters-compact[data-v-6db17c96] { .filters-compact[data-v-6db17c96] {
font-size: 1rem; font-size: 1rem;
font-weight: bold; font-weight: bold;