dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-13 11:31:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

made filter and sort options clickable

Browse source
This commit is contained in:
supertiger1234 2019-09-05 20:49:16 +01:00
parent 73f76a6b7b
commit cb637bbd64
1 changed files with 28 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/components/app/Tabs/Explore/searchHeader.vue
View file

@ -4,16 +4,25 @@
<div class="filter">
<div class="title">Filter:</div>
<div class="filter-item">
<div class="item">All</div>
<div class="item selected">Verified</div>
<div
class="item"
v-for="(filter, index) in filters"
:class="{selected: filterSelected === index}"
:key="filter.name"
@click="filterSelected = index"
>{{filter.name}}</div>
</div>
</div>
<div class="filter">
<div class="title">Sort By:</div>
<div class="filter-item">
<div class="item selected">Most Users</div>
<div class="item">Least Users</div>
<div class="item">Date Added</div>
<div
class="item"
v-for="(sortBy, index) in sortBys"
:class="{selected: sortSelected === index}"
:key="sortBy.name"
@click="sortSelected = index"
>{{sortBy.name}}</div>
</div>
</div>
</div>
@ -28,9 +37,19 @@ export default {
props: ["name"],
data() {
return {
}
filters: [
{ name: "All", param: "All" },
{ name: "Verified", param: "verified" }
],
sortBys: [
{ name: "Alphabetical", param: "alphabetical" },
{ name: "Most Users", param: "most_users" },
{ name: "Least Users", param: "least_users" },
{ name: "Date Added", param: "date_added" }
],
filterSelected: 1,
sortSelected: 0
};
}
};
</script>
@ -92,7 +111,7 @@ input {
opacity: 0.9;
}
&:hover {
opacity: 0.8;
opacity: 0.8;
}
}
}