improve ui

src/Mobile.vue

@@ -394,13 +394,12 @@ i.icon.la, i.icon.las, i.icon.lab {
 
 /** Swipe handler **/
 .swipe-handler {
-    height: 16px;
+    height: 26px;
     position: absolute;
     left: 0;
     width: 100%;
     top: 0;
     cursor: pointer;
-    z-index: 10
 }
 
 .swipe-handler:after {
@@ -411,7 +410,7 @@ i.icon.la, i.icon.las, i.icon.lab {
     left: 50%;
     top: 50%;
     margin-left: -18px;
-    margin-top: -3px;
+    margin-top: -8px;
     border-radius: 3px;
     background: #666
 }

src/components/mobile/DateRangeSelectionSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" style="height:auto"
               :opened="show" @sheet:open="onSheetOpen" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content>
             <div class="display-flex padding justify-content-space-between align-items-center">
                 <div style="font-size: 18px" v-if="title"><b>{{ title }}</b></div>

src/components/mobile/InformationSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" style="height:auto"
               :opened="show" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content class="margin-top no-padding-top">
             <div class="display-flex padding justify-content-space-between align-items-center">
                 <div style="font-size: 18px" v-if="title"><b>{{ title }}</b></div>

src/components/mobile/NumberPadSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" class="numpad-sheet" style="height: auto"
               :opened="show" @sheet:open="onSheetOpen" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content class="margin-top no-padding-top">
             <div class="numpad-values">
                 <span class="numpad-value" :style="{ fontSize: currentDisplayFontSize + 'px' }">{{ currentDisplay }}</span>

src/components/mobile/PasscodeInputSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" style="height:auto"
               :opened="show" @sheet:open="onSheetOpen" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content class="margin-top no-padding-top">
             <div class="display-flex padding justify-content-space-between align-items-center">
                 <div style="font-size: 18px" v-if="title"><b>{{ title }}</b></div>

src/components/mobile/PasswordInputSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" style="height:auto"
               :opened="show" @sheet:open="onSheetOpen" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content class="margin-top no-padding-top">
             <div class="display-flex padding justify-content-space-between align-items-center">
                 <div style="font-size: 18px" v-if="title"><b>{{ title }}</b></div>

src/components/mobile/PinCodeInputSheet.vue

@@ -1,7 +1,7 @@
 <template>
     <f7-sheet swipe-to-close swipe-handler=".swipe-handler" style="height:auto"
               :opened="show" @sheet:open="onSheetOpen" @sheet:closed="onSheetClosed">
-        <div class="swipe-handler"></div>
+        <div class="swipe-handler" style="z-index: 10"></div>
         <f7-page-content class="margin-top no-padding-top">
             <div class="display-flex padding justify-content-space-between align-items-center">
                 <div style="font-size: 18px"><b>{{ title }}</b></div>

src/views/mobile/About.vue

@@ -12,7 +12,7 @@
         <f7-popup push with-subnavbar swipe-to-close swipe-handler=".swipe-handler" class="license-popup">
             <f7-page>
                 <f7-navbar>
-                    <div class="swipe-handler"></div>
+                    <div class="swipe-handler" style="z-index: 10"></div>
                     <f7-subnavbar :title="$t('License') "></f7-subnavbar>
                 </f7-navbar>
                 <f7-block strong outline>

src/views/mobile/users/DataManagement.vue

@@ -27,7 +27,7 @@
                   :swipe-to-close="!exportingData" :close-on-escape="!exportingData"
                   :close-by-backdrop-click="!exportingData" :close-by-outside-click="!exportingData"
                   :opened="showExportDataSheet" @sheet:closed="showExportDataSheet = false; exportedData = null;">
-            <div class="swipe-handler"></div>
+            <div class="swipe-handler" style="z-index: 10"></div>
             <f7-page-content class="margin-top no-padding-top">
                 <div class="display-flex padding justify-content-space-between align-items-center">
                     <div style="font-size: 18px"><b>{{ $t('Are you sure you want to export all data to csv file?') }}</b></div>