diff --git a/package.json b/package.json index 3ff834e61..df617d152 100644 --- a/package.json +++ b/package.json @@ -24,8 +24,8 @@ "@sentry/vue": "6.18.0", "@types/is-touch-device": "1.0.0", "@vue/compat": "3.2.31", - "@vueuse/core": "7.6.2", - "@vueuse/router": "7.6.2", + "@vueuse/core": "7.7.0", + "@vueuse/router": "7.7.0", "bulma-css-variables": "0.9.33", "camel-case": "4.1.2", "codemirror": "5.65.2", diff --git a/src/components/home/contentAuth.vue b/src/components/home/contentAuth.vue index 25fd01e73..113843a7d 100644 --- a/src/components/home/contentAuth.vue +++ b/src/components/home/contentAuth.vue @@ -235,7 +235,6 @@ store.dispatch('labels/loadAllLabels') .app-content { padding: $navbar-height + 1.5rem 1.5rem 1rem 1.5rem; - z-index: 2; @media screen and (max-width: $tablet) { margin-left: 0; @@ -252,11 +251,6 @@ store.dispatch('labels/loadAllLabels') } } - &.task\.detail { - padding-left: 0; - padding-right: 0; - } - .card { background: var(--white); } diff --git a/src/components/input/datepicker.vue b/src/components/input/datepicker.vue index d2432295e..f2c9a2a03 100644 --- a/src/components/input/datepicker.vue +++ b/src/components/input/datepicker.vue @@ -183,6 +183,10 @@ export default { this.updateData() }, get() { + if(!this.date) { + return '' + } + return format(this.date, 'yyy-LL-dd H:mm') }, }, diff --git a/src/components/tasks/partials/kanban-card.vue b/src/components/tasks/partials/kanban-card.vue index a3694a1b4..4a3146efe 100644 --- a/src/components/tasks/partials/kanban-card.vue +++ b/src/components/tasks/partials/kanban-card.vue @@ -104,11 +104,12 @@ export default { async toggleTaskDone(task) { this.loadingInternal = true try { + const done = !task.done await this.$store.dispatch('tasks/update', { ...task, - done: !task.done, + done, }) - if (task.done) { + if (done) { playPop() } } finally { diff --git a/src/helpers/playPop.ts b/src/helpers/playPop.ts index 6f5f7039a..3f4e50c35 100644 --- a/src/helpers/playPop.ts +++ b/src/helpers/playPop.ts @@ -3,11 +3,15 @@ import popSoundFile from '@/assets/audio/pop.mp3' export const playSoundWhenDoneKey = 'playSoundWhenTaskDone' export function playPop() { - const enabled = Boolean(localStorage.getItem(playSoundWhenDoneKey)) - if(!enabled) { + const enabled = localStorage.getItem(playSoundWhenDoneKey) === 'true' + if (!enabled) { return } + playPopSound() +} + +export function playPopSound() { const popSound = new Audio(popSoundFile) popSound.play() -} \ No newline at end of file +} diff --git a/src/styles/components/list.scss b/src/styles/components/list.scss index 6475a395e..5fbb06778 100644 --- a/src/styles/components/list.scss +++ b/src/styles/components/list.scss @@ -23,7 +23,7 @@ $filter-container-top-link-share-list: -47px; display: flex; justify-content: flex-end; - .button:not(:last-child) { + .button:not(:last-of-type) { margin-right: .5rem; } } diff --git a/src/styles/theme/theme.scss b/src/styles/theme/theme.scss index 9c10e7699..8087a2e19 100644 --- a/src/styles/theme/theme.scss +++ b/src/styles/theme/theme.scss @@ -18,6 +18,11 @@ box-shadow: 0 0 0 2px hsla(var(--primary-hsl), 0.5); } +:root { + // Bulma sets this to "scroll" which gives us a scrollbar even if there's no content to scroll + --body-overflow-y: auto; +} + body { background: var(--site-background); min-height: 100vh; diff --git a/src/views/list/ListKanban.vue b/src/views/list/ListKanban.vue index fa2b64163..d25a0af4c 100644 --- a/src/views/list/ListKanban.vue +++ b/src/views/list/ListKanban.vue @@ -616,7 +616,7 @@ $crazy-height-calculation-tasks: '#{$crazy-height-calculation} - 1rem - 2.5rem - $filter-container-height: '1rem - #{$switch-view-height}'; // FIXME: -.app-content.list\.kanban { +.app-content.list\.kanban, .app-content.task\.detail { padding-bottom: 0 !important; } @@ -653,17 +653,22 @@ $filter-container-height: '1rem - #{$switch-view-height}'; border-radius: $radius; } } + + .sortable-chosen .task { + transform: rotate(3deg); + } .bucket { border-radius: $radius; position: relative; margin: 0 $bucket-right-margin 0 0; - max-height: 100%; + max-height: calc(100% - 1rem); // 1rem spacing to the bottom min-height: 20px; width: $bucket-width; display: flex; flex-direction: column; + overflow: hidden; // Make sure the edges are always rounded .tasks { overflow: hidden auto; @@ -764,6 +769,7 @@ $filter-container-height: '1rem - #{$switch-view-height}'; background-color: var(--grey-100); border-bottom-left-radius: $radius; border-bottom-right-radius: $radius; + transform: none; .button { background-color: transparent; @@ -775,6 +781,7 @@ $filter-container-height: '1rem - #{$switch-view-height}'; } } +// FIXME: This does not seem to work .task-dragging { transform: rotateZ(3deg); transition: transform 0.18s ease; diff --git a/src/views/list/ListWrapper.vue b/src/views/list/ListWrapper.vue index d816b90e8..9b3911a7c 100644 --- a/src/views/list/ListWrapper.vue +++ b/src/views/list/ListWrapper.vue @@ -139,6 +139,7 @@ async function loadList(listIdToLoad: number) { @media screen and (max-width: $tablet) { display: flex; justify-content: center; + flex-direction: column; } } @@ -149,7 +150,7 @@ async function loadList(listIdToLoad: number) { font-size: .75rem; box-shadow: var(--shadow-sm); height: $switch-view-height; - margin-bottom: 1rem; + margin: 0 auto 1rem; padding: .5rem; a { diff --git a/src/views/user/settings/General.vue b/src/views/user/settings/General.vue index 279b004ff..298b37f7d 100644 --- a/src/views/user/settings/General.vue +++ b/src/views/user/settings/General.vue @@ -135,7 +135,7 @@ import {computed, watch, ref} from 'vue' import {useI18n} from 'vue-i18n' -import {playSoundWhenDoneKey, playPop} from '@/helpers/playPop' +import {playSoundWhenDoneKey, playPopSound} from '@/helpers/playPop' import {availableLanguages} from '@/i18n' import {getQuickAddMagicMode, setQuickAddMagicMode} from '@/helpers/quickAddMagicMode' import {PrefixMode} from '@/modules/parseTaskText' @@ -230,13 +230,13 @@ export default { watch: { playSoundWhenDone(play) { if (play) { - playPop() + playPopSound() } }, }, methods: { async updateSettings() { - localStorage.setItem(playSoundWhenDoneKey, this.playSoundWhenDone) + localStorage.setItem(playSoundWhenDoneKey, this.playSoundWhenDone ? 'true' : 'false') setQuickAddMagicMode(this.quickAddMagicMode) await this.$store.dispatch('auth/saveUserSettings', { diff --git a/yarn.lock b/yarn.lock index 95186c75b..6ea760568 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3573,26 +3573,26 @@ resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e" integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ== -"@vueuse/core@7.6.2": - version "7.6.2" - resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-7.6.2.tgz#1b9aa92048991189fac31577ff439296efa5fb4a" - integrity sha512-bjAbXJVJO6aElMaZtDz2B70C0L6jFk/jGVqJxWZS5huffxA6dW5DN6tQQJwzOnx9B9rDhePHJIFKsix0qZIH2Q== +"@vueuse/core@7.7.0": + version "7.7.0" + resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-7.7.0.tgz#ddc5bbc910fbe0e2eda2cc823998dcf4a13265b4" + integrity sha512-DS8+dg758CiWnswebYHjS05PqTtc1ZLomsDlkFjG/KC0iFRgFIsGC66AAGuSXLqWCoirp2xN6N2mkrp1aHdI7A== dependencies: - "@vueuse/shared" "7.6.2" + "@vueuse/shared" "7.7.0" vue-demi "*" -"@vueuse/router@7.6.2": - version "7.6.2" - resolved "https://registry.yarnpkg.com/@vueuse/router/-/router-7.6.2.tgz#c94a5567449c1a75f01f15ad84573601d4559407" - integrity sha512-xTgEYnWG+FRMz8geQ3F3AbtFSQ/z3Bkj3/4q5zqu11iZXfSAfvN/P5sO6KdcS5UXTEthsm1VVoDwouEL4Dl0UQ== +"@vueuse/router@7.7.0": + version "7.7.0" + resolved "https://registry.yarnpkg.com/@vueuse/router/-/router-7.7.0.tgz#3b5aac29ff1fb03940dead32235fbd53ee34a388" + integrity sha512-iRqj5hyK2iPArIKczL0+QpoiE/ZkbxHCK10X42Oh9MJ0IyFGjF/EVO6482zQFYnO+GnqXpyHRuvWf3Rx2W5hKA== dependencies: - "@vueuse/shared" "7.6.2" + "@vueuse/shared" "7.7.0" vue-demi "*" -"@vueuse/shared@7.6.2": - version "7.6.2" - resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-7.6.2.tgz#6d83bdb003cd8a56dc779fe501e73a4cb755b802" - integrity sha512-ThDld4Mx501tahRuHV6qJGkwCr17GknZrOzlD02Na9qJcH7Pq0quNTLx5cNDou7b1CKNvE3BXi2w/hz9KuPNTQ== +"@vueuse/shared@7.7.0": + version "7.7.0" + resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-7.7.0.tgz#4fa97e68f987c8a10bf075de0e57b986da9f1b38" + integrity sha512-ANzMcUnjuUPJ9nWqMAqYt8p0qon6AH5pP5/V/0RSWkwCIWZwi57ujIaxizzMwnJECUF/73BmsRmpvvtokCIrKw== dependencies: vue-demi "*"