1
0

feat: align sort icon color

This commit is contained in:
Dominik Pschenitschni 2024-06-13 23:00:43 +02:00 committed by konrad
parent e59beb3732
commit 0061ec03f5
2 changed files with 17 additions and 12 deletions

View File

@ -278,7 +278,7 @@ import PriorityLabel from '@/components/tasks/partials/priorityLabel.vue'
import Labels from '@/components/tasks/partials/labels.vue' import Labels from '@/components/tasks/partials/labels.vue'
import DateTableCell from '@/components/tasks/partials/date-table-cell.vue' import DateTableCell from '@/components/tasks/partials/date-table-cell.vue'
import Fancycheckbox from '@/components/input/fancycheckbox.vue' import Fancycheckbox from '@/components/input/fancycheckbox.vue'
import Sort from '@/components/tasks/partials/sort.vue' import Sort from '@/components/tasks/partials/Sort.vue'
import FilterPopup from '@/components/project/partials/filter-popup.vue' import FilterPopup from '@/components/project/partials/filter-popup.vue'
import Pagination from '@/components/misc/pagination.vue' import Pagination from '@/components/misc/pagination.vue'
import Popup from '@/components/misc/popup.vue' import Popup from '@/components/misc/popup.vue'

View File

@ -1,31 +1,36 @@
<template> <template>
<BaseButton> <BaseButton>
<icon <Icon
v-if="order === 'asc'" v-if="order === 'asc'"
icon="sort-up" icon="sort-up"
class="sort__icon"
/> />
<icon <Icon
v-else-if="order === 'desc'" v-else-if="order === 'desc'"
icon="sort-up" icon="sort-up"
rotation="180" rotation="180"
class="sort__icon"
/> />
<icon <Icon
v-else v-else
icon="sort" icon="sort"
class="sort__icon"
/> />
</BaseButton> </BaseButton>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import type {PropType} from 'vue'
import BaseButton from '@/components/base/BaseButton.vue' import BaseButton from '@/components/base/BaseButton.vue'
type Order = 'asc' | 'desc' | 'none' withDefaults(defineProps<{
order?: 'asc' | 'desc' | 'none'
defineProps({ }>(), {
order: { order: 'none',
type: String as PropType<Order>,
default: 'none',
},
}) })
</script> </script>
<style lang="scss" scoped>
.sort__icon {
color: var(--grey-400);
}
</style>