diff --git a/src/components/navigation/AppNavigationBoard.vue b/src/components/navigation/AppNavigationBoard.vue index 642934521..fe9316246 100644 --- a/src/components/navigation/AppNavigationBoard.vue +++ b/src/components/navigation/AppNavigationBoard.vue @@ -9,6 +9,8 @@ :to="routeTo" :undo="deleted" :menu-placement="'auto'" + :force-display-actions="isTouchDevice" + @click="onNavigate" @undo="unDelete"> @@ -152,6 +154,9 @@ import CloseIcon from 'vue-material-design-icons/Close.vue' import CheckIcon from 'vue-material-design-icons/Check.vue' import { loadState } from '@nextcloud/initial-state' +import { emit } from '@nextcloud/event-bus' + +import isTouchDevice from '../../mixins/isTouchDevice.js' const canCreateState = loadState('deck', 'canCreate') @@ -173,6 +178,7 @@ export default { directives: { ClickOutside, }, + mixins: [isTouchDevice], inject: [ 'boardApi', ], @@ -336,6 +342,13 @@ export default { actionExport() { this.boardApi.exportBoard(this.board) }, + onNavigate() { + if (this.isTouchDevice) { + emit('toggle-navigation', { + open: false, + }) + } + }, }, } diff --git a/src/mixins/isTouchDevice.js b/src/mixins/isTouchDevice.js new file mode 100644 index 000000000..ddeb71113 --- /dev/null +++ b/src/mixins/isTouchDevice.js @@ -0,0 +1,12 @@ +/** + * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +export default { + computed: { + isTouchDevice() { + return ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) + }, + }, +}