vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feat: color the task color button when the task has a color set
continuous-integration/drone/pr Build is passing Details

This commit is contained in:
kolaente 2022-09-07 17:57:44 +02:00
parent 65fd2f14a0
commit 60a79996f4
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/views/tasks/TaskDetailView.vue
View File

@ -376,6 +376,8 @@
variant="secondary"
icon="fill-drip"
v-shortcut="'c'"
:class="{'has-light-text': color !== TASK_DEFAULT_COLOR && !colorIsDark(color)}"
:style="{'background-color': color !== TASK_DEFAULT_COLOR ? color : false}"
>
{{ $t('task.detail.actions.color') }}
</x-button>
@ -426,7 +428,7 @@ import {defineComponent} from 'vue'
import cloneDeep from 'lodash.clonedeep'
import TaskService from '../../services/task'
import TaskModel, { type ITask } from '@/models/task'
import TaskModel, {type ITask, TASK_DEFAULT_COLOR} from '@/models/task'
import { PRIORITIES as priorites } from '@/constants/priorities'
import {RIGHTS as rights} from '@/constants/rights'
@ -457,6 +459,7 @@ import { setTitle } from '@/helpers/setTitle'
import {getNamespaceTitle} from '@/helpers/getNamespaceTitle'
import {getListTitle} from '@/helpers/getListTitle'
import type { IList } from '@/models/list'
import {colorIsDark} from '@/helpers/color/colorIsDark'
function scrollIntoView(el) {
if (!el) {
@ -523,6 +526,8 @@ export default defineComponent({
showDeleteModal: false,
// Used to avoid flashing of empty elements if the task content is not yet loaded.
visible: false,
TASK_DEFAULT_COLOR,
activeFields: {
assignees: false,
@ -590,6 +595,11 @@ export default defineComponent({
shouldShowClosePopup() {
return this.$route.name.includes('kanban')
},
color() {
return this.task.getHexColor
? this.task.getHexColor()
: TASK_DEFAULT_COLOR
},
},
methods: {
getNamespaceTitle,
@ -741,6 +751,8 @@ export default defineComponent({
this.task = await this.taskService.update(this.task)
this.$store.dispatch('namespaces/loadNamespacesIfFavoritesDontExist')
},
colorIsDark,
},
})
</script>
@ -928,7 +940,11 @@ $flash-background-duration: 750ms;
.button {
width: 100%;
margin-bottom: .5rem;
justify-content: left;
justify-content: left;
&.has-light-text {
color: var(--white);
}
}
}