Fix various small inconsistencies and styles

login infinite modal, *List style, ToolAdminpw dump, BackupCreate colors
This commit is contained in:
Axolotle 2020-11-25 18:23:52 +01:00
parent 7ce154d597
commit 864945a2ac
9 changed files with 63 additions and 38 deletions

View file

@ -159,7 +159,7 @@ export default {
<style lang="scss" scoped>
#console {
position: sticky;
z-index: 5;
z-index: 15;
bottom: 0;
margin-left: -1.5rem;

View file

@ -10,7 +10,6 @@
</b-alert>
<slot name="disclaimer" />
<hr>
{{ $v.form.currentPassword }}
</template>
<slot name="extra-fields" v-bind="{ v: $v, fields, form }" />

View file

@ -65,8 +65,9 @@ export default {
commit('SET_YUNOHOST_INFOS', null)
},
'DISCONNECT' ({ dispatch }, route) {
'DISCONNECT' ({ dispatch, commit }, route) {
dispatch('RESET_CONNECTED')
commit('UPDATE_WAITING', false)
if (router.currentRoute.name === 'login') return
router.push({
name: 'login',

View file

@ -18,29 +18,33 @@
</div>
</div>
<b-alert v-if="apps === null" variant="warning" show>
<icon iname="exclamation-triangle" /> {{ $t('no_installed_apps') }}
</b-alert>
<template v-if="apps !== undefined">
<b-alert v-if="apps === null" variant="warning" show>
<icon iname="exclamation-triangle" /> {{ $t('no_installed_apps') }}
</b-alert>
<b-list-group v-else-if="filteredApps && filteredApps.length">
<b-list-group-item
v-for="{ id, name, description, label } in filteredApps" :key="id"
:to="{ name: 'app-info', params: { id }}"
class="d-flex justify-content-between align-items-center pr-0"
>
<div>
<h5>{{ label }} <small>{{ name }}</small></h5>
<p class="m-0">
{{ description }}
</p>
</div>
<b-list-group v-else-if="filteredApps && filteredApps.length">
<b-list-group-item
v-for="{ id, name, description, label } in filteredApps" :key="id"
:to="{ name: 'app-info', params: { id }}"
class="d-flex justify-content-between align-items-center pr-0"
>
<div>
<h5 class="font-weight-bold">{{ label }}
<small v-if="name" class="text-secondary">{{ name }}</small>
</h5>
<p class="m-0">
{{ description }}
</p>
</div>
<icon iname="chevron-right" class="lg fs-sm ml-auto" />
</b-list-group-item>
</b-list-group>
<b-alert v-else-if="filteredApps" variant="warning" show>
<icon iname="exclamation-triangle" /> {{ $t('search.not_found.installed_app') }}
</b-alert>
<icon iname="chevron-right" class="lg fs-sm ml-auto" />
</b-list-group-item>
</b-list-group>
<b-alert v-else variant="warning" show>
<icon iname="exclamation-triangle" /> {{ $t('search.not_found.installed_app') }}
</b-alert>
</template>
</div>
</template>
@ -70,12 +74,32 @@ export default {
methods: {
fetchData () {
api.get('apps?full').then(({ apps }) => {
if (apps.length === 0) this.apps = null
this.apps = apps.map(({ id, name, description, permissions }) => {
if (apps.length === 0) {
this.apps = null
return
}
const multiInstances = {}
this.apps = apps.map(({ id, name, description, permissions, manifest }) => {
// FIXME seems like some apps may no have a label (replace with id)
return { id, name, description, label: permissions[id + '.main'].label }
const label = permissions[id + '.main'].label
// Display the `id` of the instead of its `name` if multiple apps share the same name
if (manifest.multi_instance) {
if (!(name in multiInstances)) {
multiInstances[name] = []
}
const labels = multiInstances[name]
if (labels.includes(label)) {
name = id
}
labels.push(label)
}
if (label === name) {
name = null
}
return { id, name, description, label }
}).sort((prev, app) => {
return prev.id > app.id ? 1 : -1
return prev.label > app.label ? 1 : -1
})
})
}

View file

@ -12,7 +12,7 @@
>
<b-list-group flush>
<!-- SYSTEM TITLE -->
<b-list-group-item class="d-flex align-items-md-center flex-column flex-md-row" variant="success">
<b-list-group-item class="d-flex align-items-md-center flex-column flex-md-row" variant="dark">
<div>
<h4 class="mb-0"><icon iname="cube" /> {{ $t('system') }}</h4>
</div>
@ -44,7 +44,7 @@
</b-list-group-item>
<!-- APPS TITLE -->
<b-list-group-item class="d-flex align-items-md-center flex-column flex-md-row" variant="success">
<b-list-group-item class="d-flex align-items-md-center flex-column flex-md-row" variant="dark">
<div>
<h4 class="mb-0"><icon iname="cubes" /> {{ $t('applications') }}</h4>
</div>

View file

@ -1,4 +1,4 @@
<template lang="html">
<template>
<div class="domain-list">
<div class="actions">
<b-input-group>
@ -21,14 +21,14 @@
class="d-flex justify-content-between align-items-center pr-0"
>
<div>
<h5>
<h5 class="font-weight-bold">
{{ domain }}
<small v-if="domain === mainDomain">
<span class="sr-only">{{ $t('words.default') }}</span>
<icon iname="star" :title="$t('words.default')" />
</small>
</h5>
<p>https://{{ domain }}</p>
<p class="font-italic">https://{{ domain }}</p>
</div>
<icon iname="chevron-right" class="lg fs-sm ml-auto" />
</b-list-group-item>

View file

@ -17,7 +17,7 @@
class="d-flex justify-content-between align-items-center pr-0"
>
<div class="w-100">
<h5>{{ name }} <small>{{ description }}</small></h5>
<h5 class="font-weight-bold">{{ name }} <small class="text-secondary">{{ description }}</small></h5>
<p class="mb-0">
<span :class="status === 'running' ? 'text-success' : 'text-danger'">
<icon :iname="status === 'running' ? 'check-circle' : 'times'" />

View file

@ -40,13 +40,14 @@ export default {
fields: {
locale: {
label: this.$i18n.t('tools_webadmin.locale'),
label: this.$i18n.t('tools_webadmin.language'),
component: 'SelectItem',
props: { id: 'locale', choices: [] }
},
fallbackLocale: {
label: this.$i18n.t('tools_webadmin.fallback_locale'),
label: this.$i18n.t('tools_webadmin.fallback_language'),
description: this.$i18n.t('tools_webadmin.fallback_language_description'),
component: 'SelectItem',
props: { id: 'fallback-locale', choices: [] }
},

View file

@ -36,9 +36,9 @@
class="d-flex justify-content-between align-items-center pr-0"
>
<div>
<h5 :class="{rounded: !users}">
<h5 :class="{rounded: !users}" class="font-weight-bold">
{{ user.username }}
<small>({{ user.fullname }})</small>
<small class="text-secondary">({{ user.fullname }})</small>
</h5>
<p :class="{rounded: !users}">
{{ user.mail }}