diff options
author | Julius Härtl <jus@bitgrid.net> | 2020-08-19 21:50:40 +0200 |
---|---|---|
committer | Julien Veyssier <eneiluj@posteo.net> | 2020-08-20 12:27:57 +0200 |
commit | 8a3016565f55c123a8259c6a982cc9425b5036b8 (patch) | |
tree | dba45cb1a9ec154d5b1823f13b07006dabe1f0a6 /apps/dashboard/src | |
parent | 077e2fec74d19bec23af6e95c082d3802a0c0a91 (diff) | |
download | nextcloud-server-8a3016565f55c123a8259c6a982cc9425b5036b8.tar.gz nextcloud-server-8a3016565f55c123a8259c6a982cc9425b5036b8.zip |
Small fixes to cleanup code
Signed-off-by: Julius Härtl <jus@bitgrid.net>
Diffstat (limited to 'apps/dashboard/src')
-rw-r--r-- | apps/dashboard/src/App.vue | 8 | ||||
-rw-r--r-- | apps/dashboard/src/components/BackgroundSettings.vue | 34 |
2 files changed, 17 insertions, 25 deletions
diff --git a/apps/dashboard/src/App.vue b/apps/dashboard/src/App.vue index d8f9406631d..ac7112c8d93 100644 --- a/apps/dashboard/src/App.vue +++ b/apps/dashboard/src/App.vue @@ -58,7 +58,7 @@ <a v-if="isAdmin" :href="appStoreUrl" class="button">{{ t('dashboard', 'Get more widgets from the app store') }}</a> <h3>{{ t('dashboard', 'Change background image') }}</h3> - <BackgroundSettings :background="background" @updateBackground="updateBackground" /> + <BackgroundSettings :background="background" @update:background="updateBackground" /> </div> </Modal> </div> @@ -275,14 +275,14 @@ export default { updateGlobalStyles() { document.body.setAttribute('data-dashboard-background', this.background) if (window.OCA.Theming.inverted) { - document.body.classList.add('dashboard-inverted') + document.body.classList.add('dashboard--inverted') } const shippedBackgroundTheme = shippedBackgroundList[this.background] ? shippedBackgroundList[this.background].theming : 'light' if (shippedBackgroundTheme === 'dark') { - document.body.classList.add('dashboard-dark') + document.body.classList.add('dashboard--dark') } else { - document.body.classList.remove('dashboard-dark') + document.body.classList.remove('dashboard--dark') } }, }, diff --git a/apps/dashboard/src/components/BackgroundSettings.vue b/apps/dashboard/src/components/BackgroundSettings.vue index c2903caf5cc..d87a6154de2 100644 --- a/apps/dashboard/src/components/BackgroundSettings.vue +++ b/apps/dashboard/src/components/BackgroundSettings.vue @@ -22,40 +22,32 @@ <template> <div class="background-selector"> - <a class="background filepicker" + <button class="background filepicker" :class="{ active: background === 'custom' }" tabindex="0" - @click="pickFile" - @keyup.enter="pickFile" - @keyup.space="pickFile"> + @click="pickFile"> {{ t('dashboard', 'Pick from files') }} - </a> - <a class="background default" + </button> + <button class="background default" tabindex="0" :class="{ 'icon-loading': loading === 'default', active: background === 'default' }" - @click="setDefault" - @keyup.enter="setDefault" - @keyup.space="setDefault"> + @click="setDefault"> {{ t('dashboard', 'Default images') }} - </a> - <a class="background color" + </button> + <button class="background color" :class="{ active: background === 'custom' }" tabindex="0" - @click="pickColor" - @keyup.enter="pickColor" - @keyup.space="pickColor"> + @click="pickColor"> {{ t('dashboard', 'Plain background') }} - </a> - <a v-for="shippedBackground in shippedBackgrounds" + </button> + <button v-for="shippedBackground in shippedBackgrounds" :key="shippedBackground.name" v-tooltip="shippedBackground.details.attribution" :class="{ 'icon-loading': loading === shippedBackground.name, active: background === shippedBackground.name }" tabindex="0" class="background" :style="{ 'background-image': 'url(' + shippedBackground.preview + ')' }" - @click="setShipped(shippedBackground.name)" - @keyup.enter="setShipped(shippedBackground.name)" - @keyup.space="setShipped(shippedBackground.name)" /> + @click="setShipped(shippedBackground.name)" /> </div> </template> @@ -98,13 +90,13 @@ export default { const background = data.type === 'custom' || data.type === 'default' ? data.type : data.value this.backgroundImage = getBackgroundUrl(background, data.version) if (data.type === 'color') { - this.$emit('updateBackground', data) + this.$emit('update:background', data) this.loading = false return } const image = new Image() image.onload = () => { - this.$emit('updateBackground', data) + this.$emit('update:background', data) this.loading = false } image.src = this.backgroundImage |