JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: fix storj token card flexible height

Browse Source 
This change fixes an issue where the storj token cards will extend
their height to match their parent, causing them to get taller when the
add card form is showing.

Change-Id: I22219c8e537bda6555c8c3bf813f9649b664639a
This commit is contained in:
Wilfred Asomani 2023-11-10 15:40:37 +00:00 committed by Wilfred Asomani
parent dc28dadbc2
commit 443a7b220e
3 changed files with 9 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/satellite/src/components/account/billing/billingTabs/PaymentMethods.vue
View File

@ -14,11 +14,13 @@
/>
<add-token-card-native
v-else-if="nativeTokenPaymentsEnabled"
class="payments-area__container__token-card"
:parent-init-loading="parentInitLoading"
@showTransactions="showTransactionsTable"
/>
<add-token-card
v-else
class="payments-area__container__token-card"
:total-count="transactionCount"
/>
<div v-for="card in creditCards" :key="card.id" class="payments-area__container__cards">
@ -784,11 +786,15 @@ $align: center;
flex-wrap: wrap;
gap: 10px;
&__cards {
width: 348px;
&__cards, &__token-card {
height: 203px;
padding: 24px;
width: 348px;
box-sizing: border-box;
margin-right: 10px;
}
&__cards {
padding: 24px;
background: #fff;
box-shadow: 0 0 20px rgb(0 0 0 / 4%);
border-radius: 10px;

8
web/satellite/src/components/account/billing/paymentMethods/AddTokenCard.vue
View File

@ -25,16 +25,8 @@ import StorjLarge from '@/../static/images/billing/storj-icon-large.svg';
</script>
<style scoped lang="scss">
.token-loader {
width: 100% !important;
padding: 0 !important;
margin: 40px 0;
}
.token {
border-radius: 10px;
width: 348px;
height: 203px;
box-sizing: border-box;
padding: 24px;
box-shadow: 0 0 20px rgb(0 0 0 / 4%);

2
web/satellite/src/components/account/billing/paymentMethods/AddTokenCardNative.vue
View File

@ -196,8 +196,6 @@ onMounted(async (): Promise<void> => {
<style scoped lang="scss">
.token {
border-radius: 10px;
width: 300px;
margin-right: 10px;
padding: 24px;
box-shadow: 0 0 20px rgb(0 0 0 / 4%);
position: relative;