PWA improvments (#622)
Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/622 Co-authored-by: konrad <konrad@kola-entertainments.de> Co-committed-by: konrad <konrad@kola-entertainments.de>
This commit is contained in:
parent
a1e1fe4eb0
commit
c4067c7c35
9 changed files with 67 additions and 60 deletions
|
@ -6,8 +6,10 @@
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<meta name="description" content="Vikunja (/vɪˈkuːnjə/) - The to-do app to organize your life.">
|
<meta name="description" content="Vikunja (/vɪˈkuːnjə/) - The to-do app to organize your life.">
|
||||||
|
<meta name="theme-color" content="#1973ff"/>
|
||||||
|
|
||||||
<link rel="icon" href="/favicon.ico">
|
<link rel="icon" href="/favicon.ico">
|
||||||
|
<link rel="apple-touch-icon" href="/images/icons/apple-touch-icon-180x180.png"/>
|
||||||
<link rel="preload" crossorigin="anonymous" href="/fonts/open-sans-v15-latin-700italic.woff2" as="font">
|
<link rel="preload" crossorigin="anonymous" href="/fonts/open-sans-v15-latin-700italic.woff2" as="font">
|
||||||
<link rel="preload" crossorigin="anonymous" href="/fonts/open-sans-v15-latin-italic.woff2" as="font">
|
<link rel="preload" crossorigin="anonymous" href="/fonts/open-sans-v15-latin-italic.woff2" as="font">
|
||||||
<link rel="preload" crossorigin="anonymous" href="/fonts/quicksand-v7-latin-300.woff2" as="font">
|
<link rel="preload" crossorigin="anonymous" href="/fonts/quicksand-v7-latin-300.woff2" as="font">
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</h1>
|
</h1>
|
||||||
<div class="box has-text-left view">
|
<div class="box has-text-left view">
|
||||||
<router-view/>
|
<router-view/>
|
||||||
<a class="menu-bottom-link" href="https://vikunja.io" target="_blank">
|
<a class="menu-bottom-link" href="https://vikunja.io" target="_blank" rel="noreferrer noopener nofollow">
|
||||||
{{ $t('misc.poweredBy') }}
|
{{ $t('misc.poweredBy') }}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="no-auth-wrapper">
|
<div class="no-auth-wrapper">
|
||||||
<div class="noauth-container">
|
<div class="noauth-container">
|
||||||
<img alt="Vikunja" src="/images/logo-full.svg"/>
|
<img alt="Vikunja" src="/images/logo-full.svg" width="400" height="117"/>
|
||||||
<div class="message is-info" v-if="motd !== ''">
|
<div class="message is-info" v-if="motd !== ''">
|
||||||
<div class="message-header">
|
<div class="message-header">
|
||||||
<p>{{ $t('misc.info') }}</p>
|
<p>{{ $t('misc.info') }}</p>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<div :class="{'is-active': menuActive}" class="namespace-container">
|
<div :class="{'is-active': menuActive}" class="namespace-container">
|
||||||
<div class="menu top-menu">
|
<div class="menu top-menu">
|
||||||
<router-link :to="{name: 'home'}" class="logo">
|
<router-link :to="{name: 'home'}" class="logo">
|
||||||
<img alt="Vikunja" src="/images/logo-full.svg"/>
|
<img alt="Vikunja" src="/images/logo-full.svg" width="164" height="48"/>
|
||||||
</router-link>
|
</router-link>
|
||||||
<ul class="menu-list">
|
<ul class="menu-list">
|
||||||
<li>
|
<li>
|
||||||
|
@ -78,59 +78,62 @@
|
||||||
class="more-container"
|
class="more-container"
|
||||||
v-if="typeof listsVisible[n.id] !== 'undefined' ? listsVisible[n.id] : true"
|
v-if="typeof listsVisible[n.id] !== 'undefined' ? listsVisible[n.id] : true"
|
||||||
>
|
>
|
||||||
<ul class="menu-list can-be-hidden">
|
<draggable
|
||||||
<draggable
|
v-model="n.lists"
|
||||||
v-model="n.lists"
|
:group="`namespace-${n.id}-lists`"
|
||||||
:group="`namespace-${n.id}-lists`"
|
@start="() => drag = true"
|
||||||
@start="() => drag = true"
|
@end="e => saveListPosition(e, nk)"
|
||||||
@end="e => saveListPosition(e, nk)"
|
v-bind="dragOptions"
|
||||||
v-bind="dragOptions"
|
handle=".handle"
|
||||||
handle=".handle"
|
>
|
||||||
|
<transition-group
|
||||||
|
type="transition"
|
||||||
|
:name="!drag ? 'flip-list' : null"
|
||||||
|
tag="ul"
|
||||||
|
class="menu-list can-be-hidden"
|
||||||
>
|
>
|
||||||
<transition-group type="transition" :name="!drag ? 'flip-list' : null">
|
<!-- eslint-disable vue/no-use-v-if-with-v-for,vue/no-confusing-v-for-v-if -->
|
||||||
<!-- eslint-disable vue/no-use-v-if-with-v-for,vue/no-confusing-v-for-v-if -->
|
<li
|
||||||
<li
|
v-for="l in n.lists"
|
||||||
v-for="l in n.lists"
|
:key="l.id"
|
||||||
:key="l.id"
|
v-if="!l.isArchived"
|
||||||
v-if="!l.isArchived"
|
class="loader-container"
|
||||||
class="loader-container"
|
:class="{'is-loading': listUpdating[l.id]}"
|
||||||
:class="{'is-loading': listUpdating[l.id]}"
|
>
|
||||||
|
<router-link
|
||||||
|
class="list-menu-link"
|
||||||
|
:class="{'router-link-exact-active': currentList.id === l.id}"
|
||||||
|
:to="{ name: 'list.index', params: { listId: l.id} }"
|
||||||
|
tag="span"
|
||||||
>
|
>
|
||||||
<router-link
|
<span class="icon handle">
|
||||||
class="list-menu-link"
|
<icon icon="grip-lines"/>
|
||||||
:class="{'router-link-exact-active': currentList.id === l.id}"
|
</span>
|
||||||
:to="{ name: 'list.index', params: { listId: l.id} }"
|
<span
|
||||||
tag="span"
|
:style="{ backgroundColor: l.hexColor }"
|
||||||
>
|
class="color-bubble"
|
||||||
<span class="icon handle">
|
v-if="l.hexColor !== ''">
|
||||||
<icon icon="grip-lines"/>
|
</span>
|
||||||
</span>
|
<span class="list-menu-title">
|
||||||
<span
|
{{ getListTitle(l) }}
|
||||||
:style="{ backgroundColor: l.hexColor }"
|
</span>
|
||||||
class="color-bubble"
|
<span
|
||||||
v-if="l.hexColor !== ''">
|
:class="{'is-favorite': l.isFavorite}"
|
||||||
</span>
|
@click.stop="toggleFavoriteList(l)"
|
||||||
<span class="list-menu-title">
|
class="favorite">
|
||||||
{{ getListTitle(l) }}
|
<icon icon="star" v-if="l.isFavorite"/>
|
||||||
</span>
|
<icon :icon="['far', 'star']" v-else/>
|
||||||
<span
|
</span>
|
||||||
:class="{'is-favorite': l.isFavorite}"
|
</router-link>
|
||||||
@click.stop="toggleFavoriteList(l)"
|
<list-settings-dropdown :list="l" v-if="l.id > 0"/>
|
||||||
class="favorite">
|
<span class="list-setting-spacer" v-else></span>
|
||||||
<icon icon="star" v-if="l.isFavorite"/>
|
</li>
|
||||||
<icon :icon="['far', 'star']" v-else/>
|
</transition-group>
|
||||||
</span>
|
</draggable>
|
||||||
</router-link>
|
|
||||||
<list-settings-dropdown :list="l" v-if="l.id > 0"/>
|
|
||||||
<span class="list-setting-spacer" v-else></span>
|
|
||||||
</li>
|
|
||||||
</transition-group>
|
|
||||||
</draggable>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</aside>
|
</aside>
|
||||||
<a class="menu-bottom-link" href="https://vikunja.io" target="_blank">
|
<a class="menu-bottom-link" href="https://vikunja.io" target="_blank" rel="noreferrer noopener nofollow">
|
||||||
{{ $t('misc.poweredBy') }}
|
{{ $t('misc.poweredBy') }}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -7,8 +7,8 @@
|
||||||
>
|
>
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<router-link :to="{name: 'home'}" class="navbar-item logo">
|
<router-link :to="{name: 'home'}" class="navbar-item logo">
|
||||||
<img alt="Vikunja" src="/images/logo-full-pride.svg" v-if="(new Date()).getMonth() === 5"/>
|
<img width="164" height="48" alt="Vikunja" src="/images/logo-full-pride.svg" v-if="(new Date()).getMonth() === 5"/>
|
||||||
<img alt="Vikunja" src="/images/logo-full.svg" v-else/>
|
<img width="164" height="48" alt="Vikunja" src="/images/logo-full.svg" v-else/>
|
||||||
</router-link>
|
</router-link>
|
||||||
<a
|
<a
|
||||||
@click="$store.commit('toggleMenu')"
|
@click="$store.commit('toggleMenu')"
|
||||||
|
@ -47,7 +47,7 @@
|
||||||
</a>
|
</a>
|
||||||
<notifications/>
|
<notifications/>
|
||||||
<div class="user">
|
<div class="user">
|
||||||
<img :src="userAvatar" alt="" class="avatar"/>
|
<img :src="userAvatar" alt="" class="avatar" width="40" height="40"/>
|
||||||
<dropdown class="is-right" ref="usernameDropdown">
|
<dropdown class="is-right" ref="usernameDropdown">
|
||||||
<template v-slot:trigger>
|
<template v-slot:trigger>
|
||||||
<x-button
|
<x-button
|
||||||
|
@ -67,6 +67,7 @@
|
||||||
:href="imprintUrl"
|
:href="imprintUrl"
|
||||||
class="dropdown-item"
|
class="dropdown-item"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
rel="noreferrer noopener nofollow"
|
||||||
v-if="imprintUrl">
|
v-if="imprintUrl">
|
||||||
{{ $t('navigation.imprint') }}
|
{{ $t('navigation.imprint') }}
|
||||||
</a>
|
</a>
|
||||||
|
@ -74,6 +75,7 @@
|
||||||
:href="privacyPolicyUrl"
|
:href="privacyPolicyUrl"
|
||||||
class="dropdown-item"
|
class="dropdown-item"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
rel="noreferrer noopener nofollow"
|
||||||
v-if="privacyPolicyUrl">
|
v-if="privacyPolicyUrl">
|
||||||
{{ $t('navigation.privacy') }}
|
{{ $t('navigation.privacy') }}
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="notification is-danger">
|
<div class="notification is-danger">
|
||||||
<i18n path="loadingError.failed">
|
<i18n path="loadingError.failed">
|
||||||
<a @click="() => location.reload()">{{ $t('loadingError.tryAgain') }}</a>
|
<a @click="() => location.reload()">{{ $t('loadingError.tryAgain') }}</a>
|
||||||
<a href="https://vikunja.io/contact/">{{ $t('loadingError.contact') }}</a>
|
<a href="https://vikunja.io/contact/" rel="noreferrer noopener nofollow" target="_blank">{{ $t('loadingError.contact') }}</a>
|
||||||
</i18n>
|
</i18n>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="legal-links">
|
<div class="legal-links">
|
||||||
<a :href="imprintUrl" target="_blank" v-if="imprintUrl">{{ $t('navigation.imprint') }}</a>
|
<a :href="imprintUrl" rel="noreferrer noopener nofollow" target="_blank" v-if="imprintUrl">{{ $t('navigation.imprint') }}</a>
|
||||||
<span v-if="imprintUrl && privacyPolicyUrl"> | </span>
|
<span v-if="imprintUrl && privacyPolicyUrl"> | </span>
|
||||||
<a :href="privacyPolicyUrl" target="_blank" v-if="privacyPolicyUrl">{{ $t('navigation.privacy') }}</a>
|
<a :href="privacyPolicyUrl" rel="noreferrer noopener nofollow" target="_blank" v-if="privacyPolicyUrl">{{ $t('navigation.privacy') }}</a>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -35,7 +35,7 @@
|
||||||
v-model="backgroundSearchTerm"
|
v-model="backgroundSearchTerm"
|
||||||
/>
|
/>
|
||||||
<p class="unsplash-link">
|
<p class="unsplash-link">
|
||||||
<a href="https://unsplash.com" target="_blank">{{ $t('list.background.poweredByUnsplash') }}</a>
|
<a href="https://unsplash.com" rel="noreferrer noopener nofollow" target="_blank">{{ $t('list.background.poweredByUnsplash') }}</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="image-search-result">
|
<div class="image-search-result">
|
||||||
<a
|
<a
|
||||||
|
@ -44,7 +44,7 @@
|
||||||
@click="() => setBackground(im.id)"
|
@click="() => setBackground(im.id)"
|
||||||
class="image"
|
class="image"
|
||||||
v-for="im in backgroundSearchResult">
|
v-for="im in backgroundSearchResult">
|
||||||
<a :href="`https://unsplash.com/@${im.info.author}`" target="_blank" class="info">
|
<a :href="`https://unsplash.com/@${im.info.author}`" rel="noreferrer noopener nofollow" target="_blank" class="info">
|
||||||
{{ im.info.authorName }}
|
{{ im.info.authorName }}
|
||||||
</a>
|
</a>
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -264,7 +264,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p>
|
<p>
|
||||||
<a href="https://vikunja.io/docs/caldav/" target="_blank">
|
<a href="https://vikunja.io/docs/caldav/" rel="noreferrer noopener nofollow" target="_blank">
|
||||||
{{ $t('user.settings.caldav.more') }}
|
{{ $t('user.settings.caldav.more') }}
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
Loading…
Reference in a new issue