forked from vikunja/frontend
chore: simplify task title markup
This commit is contained in:
parent
e702524b94
commit
3e7edd84fa
|
@ -83,25 +83,23 @@
|
||||||
<span class="title">{{ rts.title }}</span>
|
<span class="title">{{ rts.title }}</span>
|
||||||
<div class="tasks noborder">
|
<div class="tasks noborder">
|
||||||
<div :key="t.id" class="task" v-for="t in rts.tasks">
|
<div :key="t.id" class="task" v-for="t in rts.tasks">
|
||||||
<router-link :to="{ name: $route.name, params: { id: t.id } }">
|
<router-link :to="{ name: $route.name, params: { id: t.id } }" :class="{ 'done': t.done}">
|
||||||
<span :class="{ 'done': t.done}" class="tasktext">
|
<span
|
||||||
|
class="different-list"
|
||||||
|
v-if="t.listId !== listId"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
class="different-list"
|
v-if="t.differentNamespace !== null"
|
||||||
v-if="t.listId !== listId"
|
v-tooltip="$t('task.relation.differentNamespace')">
|
||||||
>
|
{{ t.differentNamespace }} >
|
||||||
<span
|
</span>
|
||||||
v-if="t.differentNamespace !== null"
|
<span
|
||||||
v-tooltip="$t('task.relation.differentNamespace')">
|
v-if="t.differentList !== null"
|
||||||
{{ t.differentNamespace }} >
|
v-tooltip="$t('task.relation.differentList')">
|
||||||
</span>
|
{{ t.differentList }} >
|
||||||
<span
|
|
||||||
v-if="t.differentList !== null"
|
|
||||||
v-tooltip="$t('task.relation.differentList')">
|
|
||||||
{{ t.differentList }} >
|
|
||||||
</span>
|
|
||||||
</span>
|
</span>
|
||||||
{{ t.title }}
|
|
||||||
</span>
|
</span>
|
||||||
|
{{ t.title }}
|
||||||
</router-link>
|
</router-link>
|
||||||
<a
|
<a
|
||||||
@click="() => {showDeleteModal = true; relationToDelete = {relationKind: rts.kind, otherTaskId: t.id}}"
|
@click="() => {showDeleteModal = true; relationToDelete = {relationKind: rts.kind, otherTaskId: t.id}}"
|
||||||
|
@ -345,37 +343,31 @@ $remove-icon-width: 24px;
|
||||||
width: calc(100% - #{$remove-icon-width});
|
width: calc(100% - #{$remove-icon-width});
|
||||||
}
|
}
|
||||||
|
|
||||||
.task .tasktext {
|
.task {
|
||||||
width: calc(100% - .25rem); // Magic .25rem extra space
|
display: flex;
|
||||||
}
|
flex-wrap: wrap;
|
||||||
|
padding: .75rem;
|
||||||
.remove {
|
transition: background-color $transition;
|
||||||
width: $remove-icon-width;
|
border-radius: $radius;
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.task {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: .4rem;
|
|
||||||
transition: background-color $transition;
|
|
||||||
align-items: center;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: $radius;
|
|
||||||
border: 2px solid transparent;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: $text;
|
|
||||||
transition: color ease $transition-duration;
|
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: $grey-900;
|
background-color: $grey-200;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.remove {
|
a {
|
||||||
color: $red;
|
color: $text;
|
||||||
|
transition: color ease $transition-duration;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $grey-900;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.remove {
|
||||||
|
width: $remove-icon-width;
|
||||||
|
text-align: center;
|
||||||
|
color: $red;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user