diff options
| author | かっこかり <67428053+kakkokari-gtyih@users.noreply.github.com> | 2024-01-18 18:21:33 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-01-18 18:21:33 +0900 |
| commit | c1019a006bfa48ba7398daa02788c50be0bfb35a (patch) | |
| tree | 0f3e50544afbb216ca25732b506370a421d94299 /packages/frontend/src/pages/explore.vue | |
| parent | fix(frontend/MediaVideo): 再生シークバーの当たり判定を調整 (#... (diff) | |
| download | misskey-c1019a006bfa48ba7398daa02788c50be0bfb35a.tar.gz misskey-c1019a006bfa48ba7398daa02788c50be0bfb35a.tar.bz2 misskey-c1019a006bfa48ba7398daa02788c50be0bfb35a.zip | |
feat(frontend): 横スワイプでタブを切り替える機能 (#13011)
* (add) 横スワイプでタブを切り替える機能
* Change Changelog
* y方向の移動が一定量を超えたらスワイプを中断するように
* Update swipe distance thresholds
* Remove console.log
* adjust threshold
* rename, use v-model
* fix
* Update MkHorizontalSwipe.vue
Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
* use css module
---------
Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
Diffstat (limited to 'packages/frontend/src/pages/explore.vue')
| -rw-r--r-- | packages/frontend/src/pages/explore.vue | 11 |
1 files changed, 6 insertions, 5 deletions
diff --git a/packages/frontend/src/pages/explore.vue b/packages/frontend/src/pages/explore.vue index f068de8880..1b80014366 100644 --- a/packages/frontend/src/pages/explore.vue +++ b/packages/frontend/src/pages/explore.vue @@ -6,17 +6,17 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <MkStickyContainer> <template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template> - <div> - <div v-if="tab === 'featured'"> + <MkHorizontalSwipe v-model:tab="tab" :tabs="headerTabs"> + <div v-if="tab === 'featured'" key="featured"> <XFeatured/> </div> - <div v-else-if="tab === 'users'"> + <div v-else-if="tab === 'users'" key="users"> <XUsers/> </div> - <div v-else-if="tab === 'roles'"> + <div v-else-if="tab === 'roles'" key="roles"> <XRoles/> </div> - </div> + </MkHorizontalSwipe> </MkStickyContainer> </template> @@ -26,6 +26,7 @@ import XFeatured from './explore.featured.vue'; import XUsers from './explore.users.vue'; import XRoles from './explore.roles.vue'; import MkFoldableSection from '@/components/MkFoldableSection.vue'; +import MkHorizontalSwipe from '@/components/MkHorizontalSwipe.vue'; import { definePageMetadata } from '@/scripts/page-metadata.js'; import { i18n } from '@/i18n.js'; |