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

feat: wrap edit-task with card (#948)

Browse source 
Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/948
Reviewed-by: konrad <k@knt.li>
Co-authored-by: dpschen <dpschen@noreply.kolaente.de>
Co-committed-by: dpschen <dpschen@noreply.kolaente.de>
This commit is contained in:
dpschen 2021-11-13 14:13:56 +00:00 committed by konrad
parent 20e059c921
commit 8e6e52bf02
9 changed files with 51 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/components/misc/card.vue
View file

@ -4,7 +4,13 @@
<p class="card-header-title"> <p class="card-header-title">
{{ title }} {{ title }}
</p> </p>
<a @click="$emit('close')" class="card-header-icon" v-if="hasClose"> <a
v-if="hasClose"
class="card-header-icon"
:aria-label="$t('misc.close')"
@click="$emit('close')"
v-tooltip="$t('misc.close')"
>
<span class="icon"> <span class="icon">
<icon :icon="closeIcon"/> <icon :icon="closeIcon"/>
</span> </span>
@ -36,7 +42,7 @@ export default {
}, },
closeIcon: { closeIcon: {
type: String, type: String,
default: 'angle-right', default: 'times',
}, },
shadow: { shadow: {
type: Boolean, type: Boolean,

1
src/components/misc/create-edit.vue
View file

@ -6,7 +6,6 @@
:padding="false" :padding="false"
class="has-text-left has-overflow" class="has-text-left has-overflow"
:has-close="true" :has-close="true"
close-icon="times"
@close="$router.back()" @close="$router.back()"
:loading="loading" :loading="loading"
> >

2
src/components/misc/keyboard-shortcuts.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<modal @close="close()"> <modal @close="close()">
<card class="has-background-white has-no-shadow" :title="$t('keyboardShortcuts.title')"> <card class="has-no-shadow" :title="$t('keyboardShortcuts.title')">
<div class="message is-primary"> <div class="message is-primary">
<div class="message-body"> <div class="message-body">
{{ $t('keyboardShortcuts.allPages') }} {{ $t('keyboardShortcuts.allPages') }}

7
src/components/tasks/edit-task.vue
View file

@ -1,4 +1,10 @@
<template> <template>
<card
class="taskedit"
:title="$t('list.list.editTask')"
@close="$emit('close')"
:has-close="true"
>
<form @submit.prevent="editTaskSubmit()"> <form @submit.prevent="editTaskSubmit()">
<div class="field"> <div class="field">
<label class="label" for="tasktext">{{ $t('task.attributes.title') }}</label> <label class="label" for="tasktext">{{ $t('task.attributes.title') }}</label>
@ -66,6 +72,7 @@
{{ $t('task.openDetail') }} {{ $t('task.openDetail') }}
</router-link> </router-link>
</form> </form>
</card>
</template> </template>
<script> <script>

9
src/components/tasks/gantt-component.vue
View file

@ -167,15 +167,13 @@
</x-button> </x-button>
</form> </form>
<transition name="fade"> <transition name="fade">
<card <edit-task
v-if="isTaskEdit" v-if="isTaskEdit"
class="taskedit" class="taskedit"
:title="$t('list.list.editTask')" :title="$t('list.list.editTask')"
@close="() => {isTaskEdit = false;taskToEdit = null}" @close="() => {isTaskEdit = false;taskToEdit = null}"
:has-close="true" :task="taskToEdit"
> />
<edit-task :task="taskToEdit"/>
</card>
</transition> </transition>
</div> </div>
</template> </template>
@ -612,7 +610,6 @@ $gantt-vertical-border-color: $grey-100;
.taskedit { .taskedit {
position: fixed; position: fixed;
min-height: 0;
top: 10vh; top: 10vh;
right: 10vw; right: 10vw;
z-index: 5; z-index: 5;

2
src/components/tasks/partials/quick-add-magic.vue
View file

@ -11,7 +11,7 @@
:overflow="true" :overflow="true"
variant="hint-modal" variant="hint-modal"
> >
<card class="has-background-white has-no-shadow" :title="$t('task.quickAddMagic.title')"> <card class="has-no-shadow" :title="$t('task.quickAddMagic.title')">
<p>{{ $t('task.quickAddMagic.intro') }}</p> <p>{{ $t('task.quickAddMagic.intro') }}</p>
<h3>{{ $t('task.attributes.labels') }}</h3> <h3>{{ $t('task.attributes.labels') }}</h3>

3
src/views/About.vue
View file

@ -5,10 +5,9 @@
variant="hint-modal" variant="hint-modal"
> >
<card <card
class="has-background-white has-no-shadow" class="has-no-shadow"
:title="$t('about.title')" :title="$t('about.title')"
:has-close="true" :has-close="true"
close-icon="times"
@close="$router.back()" @close="$router.back()"
:padding="false" :padding="false"
> >

2
src/views/filters/CreateSavedFilter.vue
View file

@ -3,7 +3,7 @@
@close="$router.back()" @close="$router.back()"
variant="hint-modal" variant="hint-modal"
> >
<card class="has-background-white has-no-shadow" :title="$t('filters.create.title')"> <card class="has-no-shadow" :title="$t('filters.create.title')">
<p> <p>
{{ $t('filters.create.description') }} {{ $t('filters.create.description') }}
</p> </p>

12
src/views/list/views/List.vue
View file

@ -116,13 +116,14 @@
</template> </template>
</draggable> </draggable>
</div> </div>
<card <edit-task
v-if="isTaskEdit" v-if="isTaskEdit"
class="taskedit mt-0" :title="$t('list.list.editTask')" :has-close="true" class="taskedit mt-0"
:title="$t('list.list.editTask')"
@close="() => isTaskEdit = false" @close="() => isTaskEdit = false"
:shadow="false"> :shadow="false"
<edit-task :task="taskEditTask"/> :task="taskEditTask"
</card> />
</div> </div>
<Pagination <Pagination
@ -344,6 +345,7 @@ export default {
width: 33%; width: 33%;
margin-right: 1rem; margin-right: 1rem;
margin-left: .5rem; margin-left: .5rem;
min-height: calc(100% - 1rem);
@media screen and (max-width: $tablet) { @media screen and (max-width: $tablet) {
width: 100%; width: 100%;