local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Color the whole card on kanban if the task has a color

Browse source
This commit is contained in:
kolaente 2020-06-21 18:24:01 +02:00
parent 68681ef007
commit 8d94bdb081
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
2 changed files with 24 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/styles/components/kanban.scss
View file

@ -60,15 +60,6 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1em - 1.5em - 8px';
border-width: 2px;
}
.color {
width: 4px;
height: 24px;
display: block;
float: left;
border-radius: 0 2px 2px 0;
margin-left: -.5em;
}
h3 {
font-family: $family-sans-serif;
font-size: .85rem;
@ -81,6 +72,7 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1em - 1.5em - 8px';
.icon {
margin-right: 2px;
margin-left: 5px;
}
&.overdue {
@ -163,6 +155,26 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1em - 1.5em - 8px';
span {
width: auto;
}
&.has-light-text {
color: $white;
.task-id {
color: $grey-lighter;
}
.footer .icon,
.due-date,
.priority-label {
background: darken($task-background, 80%);
}
.footer {
.icon svg {
fill: $white;
}
}
}
}
.drop-preview {

9
src/views/list/views/Kanban.vue
View file

@ -47,14 +47,11 @@
tag="div"
:class="{
'is-loading': taskService.loading && taskUpdating[task.id],
'draggable': !taskService.loading || !taskUpdating[task.id]
'draggable': !taskService.loading || !taskUpdating[task.id],
'has-light-text': !colorIsDark(task.hexColor) && task.hexColor !== `#${task.defaultColor}`,
}"
:style="{'background-color': task.hexColor !== '#' && task.hexColor !== `#${task.defaultColor}` ? task.hexColor : false}"
>
<span
class="color"
:style="{ 'background-color': task.hexColor }"
v-if="task.hexColor !== '#' + task.defaultColor">
</span>
<span class="task-id">
<span class="is-done" v-if="task.done">Done</span>
<template v-if="task.identifier === ''">