Merge pull request #193 from aeternity/release/0.0.20

Release 0.0.20

config.xml

@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="com.superhero.cordova" version="0.0.19" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+<widget id="com.superhero.cordova" version="0.0.20" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
     <name>SuperHero</name>
     <description>SuperHero wallet</description>
     <author email="dev@cordova.apache.org" href="http://cordova.io">

package.json

@@ -1,6 +1,6 @@
 {
   "name": "superhero-wallet",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "description": "Superhero wallet",
   "author": "SuperHero",
   "license": "MIT",

src/popup/App.vue

@@ -139,6 +139,7 @@ export default {
   position: relative;
   min-height: 600px;
   margin: 0 auto;
+  overflow: visible !important;
 
   &.ae-main-popup {
     background-color: $bg-color !important;

src/popup/router/components/TransactionFilters.vue

@@ -1,22 +1,20 @@
 <template>
-  <div :style="fixedheader" class="popup">
-    <div :style="fixedheader" id="filters" class="filters" data-cy="filters">
-      <span
-        class="date d-flex"
-        :class="type == 'date' ? 'active' : ''"
-        @click="filtrateTx('date', date_type)"
-      >
-        <span>{{ $t('pages.transactionDetails.date') }}</span>
-        <FilterArrow :class="direction" />
-      </span>
-      <span
-        v-for="filter in filters"
-        v-bind:key="filter.id"
-        :class="type == filter ? 'active' : filter"
-        @click="filtrateTx(filter)"
-        >{{ $t(`pages.transactionDetails.${filter}`) }}</span
-      >
-    </div>
+  <div id="filters" class="filters" data-cy="filters">
+    <span
+      class="date d-flex"
+      :class="type === 'date' ? 'active' : ''"
+      @click="filtrateTx('date', date_type)"
+    >
+      <span>{{ $t('pages.transactionDetails.date') }}</span>
+      <FilterArrow :class="direction" />
+    </span>
+    <span
+      v-for="filter in filters"
+      v-bind:key="filter.id"
+      :class="type === filter ? 'active' : filter"
+      @click="filtrateTx(filter)"
+      >{{ $t(`pages.transactionDetails.${filter}`) }}</span
+    >
   </div>
 </template>
 
@@ -35,26 +33,12 @@ export default {
       direction: '',
       type: 'date',
       date_type: 'recent',
-      fixedheader: '',
     };
   },
-  created() {
-    window.addEventListener('scroll', this.handleScroll);
-  },
-  destroyed() {
-    window.removeEventListener('scroll', this.handleScroll);
-  },
   computed: {
     ...mapGetters(['account', 'popup', 'sdk', 'current', 'transactions']),
   },
   methods: {
-    handleScroll() {
-      if (window.scrollY > 150) {
-        this.fixedheader = 'position:fixed; top:50px;max-width:357px';
-      } else {
-        this.fixedheader = '';
-      }
-    },
     filtrateTx(type, deteType) {
       switch (type) {
         case 'date':
@@ -111,6 +95,9 @@ export default {
 <style lang="scss" scoped>
 @import '../../../common/variables';
 .filters {
+  position: sticky;
+  top: 50px;
+  top: calc(env(safe-area-inset-top) + 50px);
   background: $filters-bg;
   height: 40px;
   width: 100%;