omair/exchange-2.0
1
0
Fork 0
mirror of https://gitlab.com/uldvstar/exchange-2.0.git synced 2026-08-19 04:24:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

add function - show / hide wallet announcement

Browse Source
This commit is contained in:
edmondlang
2022-03-01 22:07:34 +08:00
parent ebbd1f162a
commit 2484ef1073
3 changed files with 34 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/sass/_responsive.scss
Vendored
+4
View File
@@ -1184,4 +1184,8 @@
border: 1px solid #d9d9d9;
border-top: none;
pointer-events: none;
}
.top-0 {
top: 0;
}
resources/assets/sass/modules/_typography.scss
Vendored
+4
View File
@@ -439,6 +439,10 @@ hr{
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 75%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 75%);
}
.gradient-white {
background: -webkit-linear-gradient(top, rgba(255,255,255, 0.5) 0%, rgba(255,255,255, 0.9) 75%);
background: linear-gradient(to bottom, rgba(255,255,255, 0.5) 0%, rgba(255,255,255, 0.9) 75%);
}
/* Other Colors
------------------------------------
resources/assets/vue/components/wallets/elements/WalletComponent.vue
+26 -7
View File
@@ -16,13 +16,31 @@
<img class="m-b-10 w-100" src="/images/10107.jpg" />
</div>
</div>
<div class="row">
<div class="col">
<p>Transferring your payments by using the wallet just got a lot easier.</p>
<p>This release can:</p>
<p class="no-margin">1. Top up once, pay for multiple transfers</p>
<p class="no-margin">2. Get your refund back to your wallet</p>
<p class="no-margin">3. Get a better exchange rate.</p>
<div class="row" :class="[{'h-25': !expanded}, {'overflow-hidden': !expanded}]">
<div class="col position-relative">
<div class="row">
<div class="col">
<p>Transferring your payments by using the wallet just got a lot easier.</p>
<div class="row">
<div class="col" v-if="expanded">
<p>This release can:</p>
<p class="no-margin">1. Top up once, pay for multiple transfers</p>
<p class="no-margin">2. Get your refund back to your wallet</p>
<p class="no-margin">3. Get a better exchange rate.</p>
</div>
</div>
</div>
</div>
<div class="row position-absolute top-0 w-100 gradient-white p-t-15 p-b-15" v-if="!expanded">
<div class="col">
<div class="m-b-0 m-t-5 d-flex justify-content-center cursor" @click="expanded = !expanded">Show more <i class="fa fa-angle-down fs-20 bold m-l-10"></i></div>
</div>
</div>
<div class="row" v-if="expanded">
<div class="col">
<div class="m-b-0 m-t-5 d-flex justify-content-center cursor" @click="expanded = !expanded">Show less <i class="fa fa-angle-up fs-20 bold m-l-10"></i></div>
</div>
</div>
</div>
</div>
</div>
@@ -82,6 +100,7 @@
data(){
return {
reload: false,
expanded: false
}
},
mixins: [componentHandler],