fix notifications div scrolling issue on mobile

This commit is contained in:
taehoon 2019-05-02 08:21:02 -04:00
parent 2d07f26dd7
commit f8ae631d8c

View file

@ -1,4 +1,5 @@
<template>
<div>
<nav class='nav-bar container' id="nav">
<div class='mobile-inner-nav' @click="scrollToTop()">
<div class='item'>
@ -14,12 +15,12 @@
</a>
</div>
</div>
<SideDrawer ref="sideDrawer" :logout="logout"/>
</nav>
<div v-if="currentUser"
class="mobile-notifications-drawer"
:class="{ 'closed': !notificationsOpen }"
@touchstart="notificationsTouchStart"
@touchmove="notificationsTouchMove"
@touchstart.stop="notificationsTouchStart"
@touchmove.stop="notificationsTouchMove"
>
<div class="mobile-notifications-header">
<span class="title">{{$t('notifications.notifications')}}</span>
@ -31,8 +32,9 @@
<Notifications ref="notifications" noHeading="true"/>
</div>
</div>
<SideDrawer ref="sideDrawer" :logout="logout"/>
<MobilePostStatusModal />
</nav>
</div>
</template>
<script src="./mobile_nav.js"></script>
@ -79,6 +81,8 @@
transition-property: transform;
transition-duration: 0.25s;
transform: translateX(0);
z-index: 1001;
-webkit-overflow-scrolling: touch;
&.closed {
transform: translateX(100%);