1
0

feat: add vite-svg-loader and add Logo component (#971)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/971
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:16:14 +00:00
committed by konrad
parent 8e6e52bf02
commit 30cc89fe25
22 changed files with 335 additions and 238 deletions

View File

@ -41,7 +41,7 @@
<div class="progress-dots">
<span v-for="i in progressDotsCount" :key="i" />
</div>
<img alt="Vikunja" :src="logoUrl" />
<Logo alt="Vikunja" />
</div>
<p>{{ $t('migrate.inProgress') }}</p>
</div>
@ -70,14 +70,17 @@
<script>
import AbstractMigrationService from '@/services/migrator/abstractMigration'
import AbstractMigrationFileService from '@/services/migrator/abstractMigrationFile'
import {MIGRATORS} from './migrators'
import Logo from '@/assets/logo.svg?component'
import logoUrl from '@/assets/logo.svg'
import {MIGRATORS} from './migrators'
const PROGRESS_DOTS_COUNT = 8
export default {
name: 'MigrateService',
components: { Logo },
data() {
return {
progressDotsCount: PROGRESS_DOTS_COUNT,
@ -87,7 +90,6 @@ export default {
message: '',
migratorAuthCode: '',
migrationService: null,
logoUrl,
}
},

View File

@ -1,8 +1,8 @@
import wunderlistIcon from './icons/wunderlist.jpg'
import todoistIcon from './icons/todoist.svg'
import trelloIcon from './icons/trello.svg'
import microsoftTodoIcon from './icons/microsoft-todo.svg'
import vikunjaFileIcon from './icons/vikunja-file.png'
import todoistIcon from './icons/todoist.svg?url'
import trelloIcon from './icons/trello.svg?url'
import microsoftTodoIcon from './icons/microsoft-todo.svg?url'
import vikunjaFileIcon from './icons/vikunja-file.png?url'
export interface Migrator {
id: string

View File

@ -38,7 +38,7 @@
</div>
<template v-if="!loading && (!tasks || tasks.length === 0) && showNothingToDo">
<h3 class="nothing">{{ $t('task.show.noTasks') }}</h3>
<img alt="" :src="llamaCoolUrl" />
<LlamaCool class="llama-cool" />
</template>
<div :class="{ 'is-loading': loading}" class="spinner"></div>
@ -64,7 +64,7 @@ import 'flatpickr/dist/flatpickr.css'
import Fancycheckbox from '../../components/input/fancycheckbox'
import {LOADING, LOADING_MODULE} from '../../store/mutation-types'
import llamaCoolUrl from '@/assets/llama-cool.svg'
import LlamaCool from '@/assets/llama-cool.svg?component'
export default {
name: 'ShowTasks',
@ -72,6 +72,7 @@ export default {
Fancycheckbox,
SingleTaskInList,
flatPickr,
LlamaCool,
},
data() {
return {
@ -83,7 +84,6 @@ export default {
cEndDate: null,
showNothingToDo: false,
llamaCoolUrl,
}
},
props: {
@ -256,28 +256,22 @@ export default {
</script>
<style lang="scss" scoped>
.show-tasks {
h3 {
text-align: left;
h3 {
text-align: left;
&.nothing {
text-align: center;
margin-top: 3rem;
}
:deep(.input) {
width: 190px;
vertical-align: middle;
margin: .5rem 0;
}
&.nothing {
text-align: center;
margin-top: 3rem;
}
img {
margin-top: 2rem;
}
.user img {
margin: 0;
:deep(.input) {
width: 190px;
vertical-align: middle;
margin: .5rem 0;
}
}
.llama-cool {
margin-top: 2rem;
}
</style>