ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

new filter icon

Browse Source 
Signed-off-by: Jakob Röhrl <jakob.roehrl@web.de>
This commit is contained in:
Jakob Röhrl
2020-05-14 12:10:08 +02:00
parent 7101fe93f6
commit de64846c70
3 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
css/icons.scss
View File

@@ -60,6 +60,7 @@
@include icon-black-white('circles', 'deck', 1); @include icon-black-white('circles', 'deck', 1);
@include icon-black-white('clone', 'deck', 1); @include icon-black-white('clone', 'deck', 1);
@include icon-black-white('filter', 'deck', 1); @include icon-black-white('filter', 'deck', 1);
@include icon-black-white('filter_set', 'deck', 1);
@include icon-black-white('attach', 'deck', 1); @include icon-black-white('attach', 'deck', 1);
@include icon-black-white('reply', 'deck', 1); @include icon-black-white('reply', 'deck', 1);

1
img/filter_set.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4.233 4.233" height="16" width="16"><path d="M.52.465h3.283L2.631 1.918h-.99zm1.122 1.453h.992v1.866l-.996-.455z" paint-order="stroke fill markers"/><ellipse ry=".691" rx=".674" cy="3.461" cx="3.45" fill-rule="evenodd"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 279 B

11
src/components/Controls.vue
View File

@@ -54,8 +54,9 @@
</div> </div>
<div class="board-action-buttons"> <div class="board-action-buttons">
<Popover> <Popover>
<Actions slot="trigger" :style="filterOpacity" :title="t('deck', 'Apply filter')"> <Actions slot="trigger" :title="t('deck', 'Apply filter')">
<ActionButton icon="icon-filter" /> <ActionButton v-if="isFilterActive" icon="icon-filter_set" />
<ActionButton v-else icon="icon-filter" />
</Actions> </Actions>
<template> <template>
@@ -218,11 +219,11 @@ export default {
} }
return 'opacity: .5;' return 'opacity: .5;'
}, },
filterOpacity() { isFilterActive() {
if (this.filter.tags.length !== 0 || this.filter.users.length !== 0 || this.filter.due !== '') { if (this.filter.tags.length !== 0 || this.filter.users.length !== 0 || this.filter.due !== '') {
return 'opacity: 1;' return true
} }
return 'opacity: .5;' return false
}, },
labelsSorted() { labelsSorted() {
return [...this.board.labels].sort((a, b) => (a.title < b.title) ? -1 : 1) return [...this.board.labels].sort((a, b) => (a.title < b.title) ? -1 : 1)