enhance(client/friendly): 一部のページを除いてフローティングボタンを表示しない
This commit is contained in:
parent
acccc705b9
commit
5b937c1d02
|
@ -40,6 +40,7 @@
|
||||||
- 스크롤이 최상단일 때 헤더를 누르면 새로고침 메뉴를 표시하도록
|
- 스크롤이 최상단일 때 헤더를 누르면 새로고침 메뉴를 표시하도록
|
||||||
|
|
||||||
### Client
|
### Client
|
||||||
|
- (Friendly) 일부 페이지를 제외하고 플로팅 버튼을 표시하지 않음
|
||||||
- 모바일에서 UI 흐림 효과를 껐을 때 가독성 향상
|
- 모바일에서 UI 흐림 효과를 껐을 때 가독성 향상
|
||||||
- 토스트 알림의 배경이 불투명하게 표시되도록
|
- 토스트 알림의 배경이 불투명하게 표시되도록
|
||||||
- 헤더의 배경이 불투명하게 표시되도록
|
- 헤더의 배경이 불투명하게 표시되도록
|
||||||
|
|
|
@ -16,9 +16,9 @@
|
||||||
<XWidgets/>
|
<XWidgets/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button v-if="isMobile && !(mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group')" :class="[$style.floatNavButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="drawerMenuShowing = true"><CPAvatar :class="$style.floatNavButtonAvatar" :user="$i"/></button>
|
<button v-if="isMobile && enableNavButton.includes(<string>mainRouter.currentRoute.value.name)" :class="[$style.floatNavButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="drawerMenuShowing = true"><CPAvatar :class="$style.floatNavButtonAvatar" :user="$i"/></button>
|
||||||
|
|
||||||
<button v-if="isMobile && !(mainRouter.currentRoute.value.name === 'messaging' || mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group')" :class="[$style.floatPostButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="os.post()"><span :class="[$style.floatPostButtonBg, { [$style.reduceBlurEffect]: !defaultStore.state.useBlurEffect }]"></span><i class="ti ti-pencil"></i></button>
|
<button v-if="isMobile && enablePostButton.includes(<string>mainRouter.currentRoute.value.name)" :class="[$style.floatPostButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="os.post()"><span :class="[$style.floatPostButtonBg, { [$style.reduceBlurEffect]: !defaultStore.state.useBlurEffect }]"></span><i class="ti ti-pencil"></i></button>
|
||||||
<button v-if="isMobile && mainRouter.currentRoute.value.name === 'messaging' && !(mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group')" :class="[$style.floatPostButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="openMessage"><span :class="[$style.floatPostButtonBg, { [$style.reduceBlurEffect]: !defaultStore.state.useBlurEffect }]"></span><i class="ti ti-plus"></i></button>
|
<button v-if="isMobile && mainRouter.currentRoute.value.name === 'messaging' && !(mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group')" :class="[$style.floatPostButton, { [$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="_button" @click="openMessage"><span :class="[$style.floatPostButtonBg, { [$style.reduceBlurEffect]: !defaultStore.state.useBlurEffect }]"></span><i class="ti ti-plus"></i></button>
|
||||||
|
|
||||||
<button v-if="!isDesktop && !isMobile" :class="[$style.widgetButton, { [$style.showEl]: showEl }]" class="_button" @click="widgetsShowing = true"><i class="ti ti-apps"></i></button>
|
<button v-if="!isDesktop && !isMobile" :class="[$style.widgetButton, { [$style.showEl]: showEl }]" class="_button" @click="widgetsShowing = true"><i class="ti ti-apps"></i></button>
|
||||||
|
@ -126,6 +126,20 @@ window.addEventListener('resize', () => {
|
||||||
isMobile.value = deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD;
|
isMobile.value = deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const enableNavButton = [
|
||||||
|
'index',
|
||||||
|
'explore',
|
||||||
|
'my-notifications',
|
||||||
|
'messaging',
|
||||||
|
];
|
||||||
|
|
||||||
|
const enablePostButton = [
|
||||||
|
'index',
|
||||||
|
'explore',
|
||||||
|
'my-notifications',
|
||||||
|
'user',
|
||||||
|
];
|
||||||
|
|
||||||
let showEl = $ref(false);
|
let showEl = $ref(false);
|
||||||
let lastScrollPosition = $ref(0);
|
let lastScrollPosition = $ref(0);
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue