From 9cfbd28b6f3980f89600686da5b81516cd8f5871 Mon Sep 17 00:00:00 2001 From: Achraf Eddaqqaq <51858084+aeddaqqa@users.noreply.github.com> Date: Fri, 3 Nov 2023 07:43:49 +0100 Subject: [PATCH 01/10] feat: creating deposit Offers (#332) --- caminojs | 2 +- package.json | 2 +- src/components/CamInput.vue | 4 +- src/components/misc/AvaxInput.vue | 120 +- src/components/modals/ClaimRewardModal.vue | 189 +++ .../wallet/earn/ClaimableRewardCard.vue | 114 ++ .../wallet/earn/CreateOfferForm.vue | 1131 +++++++++++++++++ src/components/wallet/earn/DateForm.vue | 143 +-- .../wallet/earn/DepositOfferCard.vue | 133 +- src/components/wallet/earn/DepositOffers.vue | 74 +- .../wallet/earn/DepositRewardCard.vue | 655 ++++++++++ .../wallet/earn/ModalClaimDepositReward.vue | 43 +- .../wallet/earn/ModalDepositFunds.vue | 717 +++++++++++ src/components/wallet/earn/UserRewards.vue | 226 +--- .../wallet/earn/mountCreateOfferForm.ts | 32 + src/constants.ts | 2 + src/helpers/wallet_helper.ts | 140 +- src/js/wallets/MultisigWallet.ts | 14 +- src/js/wallets/types.ts | 2 +- src/locales/en.json | 40 +- src/signavault_api.ts | 24 +- src/store/index.ts | 9 +- src/store/modules/network/network.ts | 4 +- src/store/modules/platform/platform.ts | 450 ++++--- src/store/modules/platform/types.ts | 89 +- src/views/wallet/Earn.vue | 16 +- vue.config.js | 0 webpack.common.js | 1 + yarn.lock | 82 +- 29 files changed, 3738 insertions(+), 720 deletions(-) create mode 100644 src/components/modals/ClaimRewardModal.vue create mode 100644 src/components/wallet/earn/ClaimableRewardCard.vue create mode 100644 src/components/wallet/earn/CreateOfferForm.vue create mode 100644 src/components/wallet/earn/DepositRewardCard.vue create mode 100644 src/components/wallet/earn/ModalDepositFunds.vue create mode 100644 src/components/wallet/earn/mountCreateOfferForm.ts delete mode 100644 vue.config.js diff --git a/caminojs b/caminojs index ae1a21688..460f3a9f6 160000 --- a/caminojs +++ b/caminojs @@ -1 +1 @@ -Subproject commit ae1a21688c9ad213328197b3477c2b6f59983f58 +Subproject commit 460f3a9f6724903b682c51dfbc8577a79a12f875 diff --git a/package.json b/package.json index 0448b6281..5eb82a75d 100644 --- a/package.json +++ b/package.json @@ -174,7 +174,7 @@ "weekstart": "1.0.1" }, "dependencies": { - "@c4tplatform/signavaultjs": "^1.0.11", + "@c4tplatform/signavaultjs": "^1.1", "@cypress/xpath": "^2.0.3", "vue": "^2.6.11", "vue-cli-plugin-vuetify": "^2.0.3", diff --git a/src/components/CamInput.vue b/src/components/CamInput.vue index 87968caf2..226d5af10 100644 --- a/src/components/CamInput.vue +++ b/src/components/CamInput.vue @@ -29,7 +29,7 @@ - diff --git a/src/components/wallet/earn/ClaimableRewardCard.vue b/src/components/wallet/earn/ClaimableRewardCard.vue new file mode 100644 index 000000000..b3a40b60c --- /dev/null +++ b/src/components/wallet/earn/ClaimableRewardCard.vue @@ -0,0 +1,114 @@ + + + diff --git a/src/components/wallet/earn/CreateOfferForm.vue b/src/components/wallet/earn/CreateOfferForm.vue new file mode 100644 index 000000000..a2aa42680 --- /dev/null +++ b/src/components/wallet/earn/CreateOfferForm.vue @@ -0,0 +1,1131 @@ + + + diff --git a/src/components/wallet/earn/DateForm.vue b/src/components/wallet/earn/DateForm.vue index 82f522731..1ad574201 100644 --- a/src/components/wallet/earn/DateForm.vue +++ b/src/components/wallet/earn/DateForm.vue @@ -8,14 +8,14 @@ class="date" :min-datetime="endDateMin" :max-datetime="endDateMax" + :disabled="pendingTxDate" > diff --git a/src/components/wallet/earn/ModalClaimDepositReward.vue b/src/components/wallet/earn/ModalClaimDepositReward.vue index 4fa98e7b8..b2893186f 100644 --- a/src/components/wallet/earn/ModalClaimDepositReward.vue +++ b/src/components/wallet/earn/ModalClaimDepositReward.vue @@ -54,23 +54,23 @@ diff --git a/src/components/wallet/earn/ModalDepositFunds.vue b/src/components/wallet/earn/ModalDepositFunds.vue new file mode 100644 index 000000000..4cdb3859c --- /dev/null +++ b/src/components/wallet/earn/ModalDepositFunds.vue @@ -0,0 +1,717 @@ + + + diff --git a/src/components/wallet/earn/UserRewards.vue b/src/components/wallet/earn/UserRewards.vue index 89c23afc1..a4811e310 100644 --- a/src/components/wallet/earn/UserRewards.vue +++ b/src/components/wallet/earn/UserRewards.vue @@ -1,203 +1,56 @@ diff --git a/src/components/wallet/earn/ModalDepositFunds.vue b/src/components/wallet/earn/ModalDepositFunds.vue index 4cdb3859c..1368e8043 100644 --- a/src/components/wallet/earn/ModalDepositFunds.vue +++ b/src/components/wallet/earn/ModalDepositFunds.vue @@ -205,7 +205,7 @@ import { MultisigWallet } from '@/js/wallets/MultisigWallet' import { WalletType } from '@/js/wallets/types' import { BN } from '@c4tplatform/caminojs' import { DepositOffer } from '@c4tplatform/caminojs/dist/apis/platformvm' -import { ZeroBN } from '@c4tplatform/caminojs/dist/common' +import { SignatureError, ZeroBN } from '@c4tplatform/caminojs/dist/common' import 'reflect-metadata' import { Component, Prop, Vue, Watch } from 'vue-property-decorator' import Modal from '../../modals/Modal.vue' @@ -400,10 +400,6 @@ export default class ModalDepositFunds extends Vue { return `${(Number(val.toString()) / Number(ONEAVAX.toString())).toLocaleString()}` } async submitDeposit(): Promise { - console.log({ - rewardOwner: this.rewardOwner, - isValid: isValidPChainAddress(this.rewardOwner), - }) if (this.rewardOwner && !isValidPChainAddress(this.rewardOwner)) { this.rewardOwnerError = 'Invalid address' return diff --git a/src/locales/en.json b/src/locales/en.json index 73911447c..14199d540 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -498,18 +498,18 @@ "interrest_rate": "Interrest rate ( *1 000 000 )", "min_amount": "Min Amount", "total_max_amount": "Total Max Amount", - "min_duration": "Minimum Duration (Sec)", - "max_duration": "Maximum Duration (Sec)", - "unlock_duration": "Unlock Duration (Sec)", - "no_rewards_duration": "No Rewards Duration (Sec)", + "min_duration": "Minimum Duration (Day)", + "max_duration": "Maximum Duration (Day)", + "unlock_duration": "Unlock Duration (Day)", + "no_rewards_duration": "No Rewards Duration (Day)", "memo": "Title", "flags": "Flags (Blocked:1)", "total_max_reward_amount": "Total Max Reward Amount", - "owner_address": "Owner Address (optional)", + "owner_address": "Owner Address (If filled, only allowed addresses can see and deposit funds.)", "submit": "Create Offer" }, "errors": { - "title": "Credit Offre title must be at least 64 characters long.", + "title": "Offer title must be at least 64 characters long.", "min_amount": "Minimum amount must be at least {minAmount} {symbol}." }, "offer": { From 33121ad8be00ede083ec1d03b59f94397234ff4f Mon Sep 17 00:00:00 2001 From: Achraf Eddaqqaq <51858084+aeddaqqa@users.noreply.github.com> Date: Tue, 7 Nov 2023 16:05:08 +0100 Subject: [PATCH 03/10] fix check of displaying create offer form (#335) --- .../wallet/earn/CreateOfferForm.vue | 2 +- src/components/wallet/earn/DepositOffers.vue | 26 ++++++++++--------- src/locales/en.json | 2 +- 3 files changed, 16 insertions(+), 14 deletions(-) diff --git a/src/components/wallet/earn/CreateOfferForm.vue b/src/components/wallet/earn/CreateOfferForm.vue index 97f00f4b0..d30a1552f 100644 --- a/src/components/wallet/earn/CreateOfferForm.vue +++ b/src/components/wallet/earn/CreateOfferForm.vue @@ -471,7 +471,7 @@ export default class CreateOfferForm extends Vue { /* errors */ get nameLengthError() { const bytes = new TextEncoder().encode(this.offer.memo) - return bytes.length > MAX_TITLE_BYTE_SIZE || bytes.length === 0 + return bytes.length > MAX_TITLE_BYTE_SIZE } get minAmountError() { return this.offer.minAmount.lt(new BN(1000000)) diff --git a/src/components/wallet/earn/DepositOffers.vue b/src/components/wallet/earn/DepositOffers.vue index e9a0481f1..57fdcf397 100644 --- a/src/components/wallet/earn/DepositOffers.vue +++ b/src/components/wallet/earn/DepositOffers.vue @@ -1,7 +1,7 @@ diff --git a/src/components/NetworkSettings/EditPage.vue b/src/components/NetworkSettings/EditPage.vue index 33c878339..2781e3a64 100644 --- a/src/components/NetworkSettings/EditPage.vue +++ b/src/components/NetworkSettings/EditPage.vue @@ -169,6 +169,7 @@ export default class EditPage extends Vue { diff --git a/src/components/NetworkSettings/NetworkMenu.vue b/src/components/NetworkSettings/NetworkMenu.vue index d749adfb6..f1370563e 100644 --- a/src/components/NetworkSettings/NetworkMenu.vue +++ b/src/components/NetworkSettings/NetworkMenu.vue @@ -240,7 +240,7 @@ export default class NetworkMenu extends Vue { } button { - font-size: 12px; + @include mixins.typography-caption; padding: 3px 14px; border-radius: var(--border-radius-sm); } diff --git a/src/components/NetworkSettings/NetworkRow.vue b/src/components/NetworkSettings/NetworkRow.vue index 4363c636e..0688a022f 100644 --- a/src/components/NetworkSettings/NetworkRow.vue +++ b/src/components/NetworkSettings/NetworkRow.vue @@ -109,8 +109,9 @@ export default class NetworkRow extends Vue { diff --git a/src/components/SidePanels/History/ViewTypes/BaseTx.vue b/src/components/SidePanels/History/ViewTypes/BaseTx.vue index 947ee1e1a..456c6b533 100644 --- a/src/components/SidePanels/History/ViewTypes/BaseTx.vue +++ b/src/components/SidePanels/History/ViewTypes/BaseTx.vue @@ -361,8 +361,9 @@ export default class BaseTx extends Vue { } diff --git a/src/components/SidePanels/History/ViewTypes/ImportExport.vue b/src/components/SidePanels/History/ViewTypes/ImportExport.vue index cfdcdaa6e..3fd06c3b1 100644 --- a/src/components/SidePanels/History/ViewTypes/ImportExport.vue +++ b/src/components/SidePanels/History/ViewTypes/ImportExport.vue @@ -107,10 +107,11 @@ export default class ImportExport extends Vue { } diff --git a/src/components/SidePanels/History/ViewTypes/StakingTx.vue b/src/components/SidePanels/History/ViewTypes/StakingTx.vue index 33161f2ce..577297800 100644 --- a/src/components/SidePanels/History/ViewTypes/StakingTx.vue +++ b/src/components/SidePanels/History/ViewTypes/StakingTx.vue @@ -303,10 +303,11 @@ export default class StakingTx extends Vue { } diff --git a/src/components/TestNetBanner.vue b/src/components/TestNetBanner.vue index d82e4622a..1fceb8185 100644 --- a/src/components/TestNetBanner.vue +++ b/src/components/TestNetBanner.vue @@ -21,10 +21,11 @@ export default class TestNetBanner extends Vue { diff --git a/src/components/misc/AvaxInput.vue b/src/components/misc/AvaxInput.vue index 0a6f80fbe..ac1458483 100644 --- a/src/components/misc/AvaxInput.vue +++ b/src/components/misc/AvaxInput.vue @@ -144,8 +144,7 @@ export default class AvaxInput extends Vue { .amt_in { color: var(--primary-color); - font-size: 14px; - font-family: 'Inter'; + @include mixins.typography-body-2; flex-grow: 1; flex-shrink: 1; display: block; @@ -169,7 +168,7 @@ export default class AvaxInput extends Vue { .balance { display: grid; column-gap: 10px; - font-size: 14px; + @include mixins.typography-body-2; color: var(--primary-color-light); padding: 2px 0px; @@ -188,7 +187,7 @@ export default class AvaxInput extends Vue { } span { - font-family: 'Inter'; + font-family: var(--primary-font); padding-left: 14px; } } @@ -219,7 +218,7 @@ export default class AvaxInput extends Vue { } .max_but { - font-size: 13px; + @include mixins.typography-caption; opacity: 0.4; &:hover { opacity: 1; @@ -242,7 +241,7 @@ export default class AvaxInput extends Vue { @include mixins.mobile-device { .balance { - font-size: 12px; + @include mixins.typography-caption; } } diff --git a/src/components/misc/BalancePopup/BalanceDropdown.vue b/src/components/misc/BalancePopup/BalanceDropdown.vue index 55793af7f..2edc2a19c 100644 --- a/src/components/misc/BalancePopup/BalanceDropdown.vue +++ b/src/components/misc/BalancePopup/BalanceDropdown.vue @@ -73,7 +73,7 @@ button { width: 100%; height: 100%; text-align: left; - font-size: 15px; + @include mixins.typography-body-2; svg { transition-duration: 0.2s; @@ -103,7 +103,7 @@ button { @include mixins.mobile-device { button { - font-size: 13px; + @include mixins.typography-caption; } } diff --git a/src/components/misc/BalancePopup/BalancePopup.vue b/src/components/misc/BalancePopup/BalancePopup.vue index 904ec9768..be032e99a 100644 --- a/src/components/misc/BalancePopup/BalancePopup.vue +++ b/src/components/misc/BalancePopup/BalancePopup.vue @@ -107,7 +107,7 @@ export default class BalancePopup extends Vue { height: 100%; } .desc { - font-size: 0.8rem; + @include mixins.typography-caption; padding: 3px 15px; background-color: var(--primary-color); color: var(--bg); @@ -147,7 +147,7 @@ export default class BalancePopup extends Vue { display: grid; column-gap: 15px; grid-template-columns: 48px 1fr max-content; - font-size: 0.8rem; + @include mixins.typography-caption; transition-duration: 0.2s; cursor: pointer; user-select: none; @@ -194,12 +194,12 @@ export default class BalancePopup extends Vue { } .desc { - font-size: 1.2rem; + @include mixins.typography-body-1; } .bal_row { padding: 12px 14px; - font-size: 0.9rem; + @include mixins.typography-caption; } } diff --git a/src/components/misc/BalancePopup/BalanceRow.vue b/src/components/misc/BalancePopup/BalanceRow.vue index 318cdbb58..0ae3e9fed 100644 --- a/src/components/misc/BalancePopup/BalanceRow.vue +++ b/src/components/misc/BalancePopup/BalanceRow.vue @@ -32,7 +32,7 @@ export default class BalanceRow extends Vue { background-color: var(--bg-light); border-radius: 6px; padding: 2px 6px; - font-size: 11px; + @include mixins.typography-caption; align-self: center; text-align: center; } diff --git a/src/components/misc/BalancePopup/CollectibleFamily.vue b/src/components/misc/BalancePopup/CollectibleFamily.vue index 32473b4a7..1803472c2 100644 --- a/src/components/misc/BalancePopup/CollectibleFamily.vue +++ b/src/components/misc/BalancePopup/CollectibleFamily.vue @@ -128,7 +128,7 @@ $card_w: 80px; } .fam_title { color: var(--primary-color-light); - font-size: 12px; + @include mixins.typography-caption; margin-bottom: 8px !important; } diff --git a/src/components/misc/CopyText.vue b/src/components/misc/CopyText.vue index e70ce548e..3d3266999 100644 --- a/src/components/misc/CopyText.vue +++ b/src/components/misc/CopyText.vue @@ -32,6 +32,7 @@ export default { } diff --git a/src/components/misc/CurrencyInput.vue b/src/components/misc/CurrencyInput.vue index 63d3802cc..8764f688d 100644 --- a/src/components/misc/CurrencyInput.vue +++ b/src/components/misc/CurrencyInput.vue @@ -79,7 +79,8 @@ export default { }, } - diff --git a/src/components/misc/EVMInputDropdown/EVMAssetDropdown.vue b/src/components/misc/EVMInputDropdown/EVMAssetDropdown.vue index 707860721..24e056406 100644 --- a/src/components/misc/EVMInputDropdown/EVMAssetDropdown.vue +++ b/src/components/misc/EVMInputDropdown/EVMAssetDropdown.vue @@ -93,7 +93,7 @@ button { } .token_row { - font-size: 13px; + @include mixins.typography-caption; padding: 8px 18px; display: grid; grid-template-columns: max-content max-content 1fr; @@ -139,7 +139,7 @@ button { } .token_row { - font-size: 16px; + @include mixins.typography-body-2; border-bottom: 1px solid var(--bg-light); padding-top: 14px; padding-bottom: 14px; diff --git a/src/components/misc/EVMInputDropdown/EVMInputDropdown.vue b/src/components/misc/EVMInputDropdown/EVMInputDropdown.vue index b681bc4d5..2fee61d00 100644 --- a/src/components/misc/EVMInputDropdown/EVMInputDropdown.vue +++ b/src/components/misc/EVMInputDropdown/EVMInputDropdown.vue @@ -215,11 +215,12 @@ export default class EVMInputDropdown extends Vue { } diff --git a/src/components/misc/NftPayloadView/NftPayloadAllow.vue b/src/components/misc/NftPayloadView/NftPayloadAllow.vue index 43241e522..da7118b1f 100644 --- a/src/components/misc/NftPayloadView/NftPayloadAllow.vue +++ b/src/components/misc/NftPayloadView/NftPayloadAllow.vue @@ -26,6 +26,7 @@ export default class NftPayloadAllow extends Vue { } diff --git a/src/components/misc/ValidatorList/ValidatorsList.vue b/src/components/misc/ValidatorList/ValidatorsList.vue index 0bfbea08a..d8c491c7a 100644 --- a/src/components/misc/ValidatorList/ValidatorsList.vue +++ b/src/components/misc/ValidatorList/ValidatorsList.vue @@ -144,7 +144,7 @@ th { position: sticky; top: 0; padding: 2px 14px; - font-size: 14px; + @include mixins.typography-caption; background-color: var(--bg-wallet-light); } diff --git a/src/components/modals/AddERC20TokenModal.vue b/src/components/modals/AddERC20TokenModal.vue index e78045798..fa35718b2 100644 --- a/src/components/modals/AddERC20TokenModal.vue +++ b/src/components/modals/AddERC20TokenModal.vue @@ -158,14 +158,14 @@ export default class AddERC20TokenModal extends Vue { } label { - font-size: 13px; + @include mixins.typography-caption; } input { width: 100%; background-color: var(--bg-light); padding: 14px 24px; border-radius: 3px; - font-size: 14px; + @include mixins.typography-caption; color: var(--primary-color); } } diff --git a/src/components/modals/AddERCNftTokenModal.vue b/src/components/modals/AddERCNftTokenModal.vue index 3f047fd7d..1de713a11 100644 --- a/src/components/modals/AddERCNftTokenModal.vue +++ b/src/components/modals/AddERCNftTokenModal.vue @@ -187,14 +187,14 @@ export default class AddERCNftTokenModal extends Vue { } label { - font-size: 13px; + @include mixins.typography-caption; } input { width: 100%; background-color: var(--bg-light); padding: 14px 24px; border-radius: 3px; - font-size: 14px; + @include mixins.typography-caption; color: var(--primary-color); } @@ -247,7 +247,7 @@ export default class AddERCNftTokenModal extends Vue { button { align-self: baseline; - font-size: 0.8em; + @include mixins.typography-caption; opacity: 0.5; &:hover { diff --git a/src/components/modals/AvmTokenSelect.vue b/src/components/modals/AvmTokenSelect.vue index 5dbc2edd9..3a4d6dab7 100644 --- a/src/components/modals/AvmTokenSelect.vue +++ b/src/components/modals/AvmTokenSelect.vue @@ -99,7 +99,7 @@ $logo_w: 38px; } .token_row { - font-size: 15px; + @include mixins.typography-body-2; display: grid; grid-template-columns: max-content max-content 1fr; column-gap: 12px; @@ -138,7 +138,7 @@ $logo_w: 38px; p:last-of-type { color: var(--primary-color-light); - font-size: 13px; + @include mixins.typography-caption; } } diff --git a/src/components/modals/EvmTokenSelect/ERCNftRow.vue b/src/components/modals/EvmTokenSelect/ERCNftRow.vue index bda24815a..0a0029787 100644 --- a/src/components/modals/EvmTokenSelect/ERCNftRow.vue +++ b/src/components/modals/EvmTokenSelect/ERCNftRow.vue @@ -52,6 +52,7 @@ export default class ERCNftRow extends Vue { } diff --git a/src/components/modals/UtxoSelect/UtxoSelect.vue b/src/components/modals/UtxoSelect/UtxoSelect.vue index 067c901f4..fa45cce60 100644 --- a/src/components/modals/UtxoSelect/UtxoSelect.vue +++ b/src/components/modals/UtxoSelect/UtxoSelect.vue @@ -151,6 +151,7 @@ export default class UtxoSelect extends Vue { } diff --git a/src/components/wallet/advanced/SignMessage/SearchAddress.vue b/src/components/wallet/advanced/SignMessage/SearchAddress.vue index a88e98460..2933549c0 100644 --- a/src/components/wallet/advanced/SignMessage/SearchAddress.vue +++ b/src/components/wallet/advanced/SignMessage/SearchAddress.vue @@ -93,7 +93,7 @@ $addrSize: 14px; padding: 2px 6px; cursor: pointer; font-size: $addrSize; - font-family: 'Inter'; + font-family: var(--primary-font); } input { diff --git a/src/components/wallet/advanced/SignMessage/SignMessage.vue b/src/components/wallet/advanced/SignMessage/SignMessage.vue index 7165440bb..315ed0213 100644 --- a/src/components/wallet/advanced/SignMessage/SignMessage.vue +++ b/src/components/wallet/advanced/SignMessage/SignMessage.vue @@ -80,6 +80,7 @@ export default class SignMessage extends Vue { } diff --git a/src/components/wallet/earn/ChainTransfer/TxState.vue b/src/components/wallet/earn/ChainTransfer/TxState.vue index def05bf20..826c0fb47 100644 --- a/src/components/wallet/earn/ChainTransfer/TxState.vue +++ b/src/components/wallet/earn/ChainTransfer/TxState.vue @@ -49,6 +49,7 @@ export default class TxStateCard extends Vue { } diff --git a/src/components/wallet/earn/Delegate/NodeCard.vue b/src/components/wallet/earn/Delegate/NodeCard.vue index cb9119d7e..ad2237dfc 100644 --- a/src/components/wallet/earn/Delegate/NodeCard.vue +++ b/src/components/wallet/earn/Delegate/NodeCard.vue @@ -140,7 +140,7 @@ export default class NodeCard extends Vue { .node_id { word-break: break-all; //width: max-content; - font-size: 13px; + @include mixins.typography-caption; padding: 6px 14px; background-color: var(--bg-light); border-bottom: 2px solid var(--bg); @@ -152,10 +152,10 @@ export default class NodeCard extends Vue { column-gap: 14px; } label { - font-size: 13px; + @include mixins.typography-caption; } p { - font-size: 15px; + @include mixins.typography-body-2; color: var(--primary-color-light); } @@ -163,7 +163,7 @@ p { display: grid; grid-template-columns: 1fr 1fr; p { - font-size: 13px; + @include mixins.typography-caption; } } diff --git a/src/components/wallet/earn/UserRewardRow.vue b/src/components/wallet/earn/UserRewardRow.vue index e5791cea7..fb6fb1347 100644 --- a/src/components/wallet/earn/UserRewardRow.vue +++ b/src/components/wallet/earn/UserRewardRow.vue @@ -113,7 +113,7 @@ export default class UserRewardRow extends Vue { .reward_row { border-radius: var(--border-radius-sm); overflow: hidden; - font-size: 14px; + @include mixins.typography-caption; //border: 2px solid var(--bg-light); background-color: var(--bg-light); } diff --git a/src/components/wallet/earn/UserRewards.vue b/src/components/wallet/earn/UserRewards.vue index a4811e310..3454fe3af 100644 --- a/src/components/wallet/earn/UserRewards.vue +++ b/src/components/wallet/earn/UserRewards.vue @@ -50,6 +50,7 @@ export default class UserRewards extends Vue { } diff --git a/src/components/wallet/earn/Validate/ValidatorInfo.vue b/src/components/wallet/earn/Validate/ValidatorInfo.vue index 60926a917..e53219f2a 100644 --- a/src/components/wallet/earn/Validate/ValidatorInfo.vue +++ b/src/components/wallet/earn/Validate/ValidatorInfo.vue @@ -267,7 +267,7 @@ export default class ValidatorInfo extends Vue { diff --git a/src/components/wallet/manage/AddMultisigAlias.vue b/src/components/wallet/manage/AddMultisigAlias.vue index be4b7be32..c9accdc0b 100644 --- a/src/components/wallet/manage/AddMultisigAlias.vue +++ b/src/components/wallet/manage/AddMultisigAlias.vue @@ -132,9 +132,10 @@ export default class AddMultisigAlias extends Vue { } diff --git a/src/views/wallet/Portfolio.vue b/src/views/wallet/Portfolio.vue index d264fcd2e..5090dc319 100644 --- a/src/views/wallet/Portfolio.vue +++ b/src/views/wallet/Portfolio.vue @@ -85,7 +85,7 @@ export default { button { padding: 8px 24px; - font-size: 14px; + @include mixins.typography-caption; font-weight: bold; margin: 0px 5px; text-transform: uppercase; @@ -107,7 +107,7 @@ export default { padding: 5px; display: flex; align-items: center; - font-size: 13px; + @include mixins.typography-caption; flex-basis: 420px; flex-shrink: 1; border: 1px solid transparent; @@ -150,7 +150,7 @@ export default { flex-grow: 1; border-radius: 0px; margin: 0; - font-size: 12px; + @include mixins.typography-caption; } } @@ -162,7 +162,7 @@ export default { @include mixins.medium-device { .header { button { - font-size: 13px; + @include mixins.typography-caption; &[active] { border-bottom-width: 2px; diff --git a/src/views/wallet/Studio.vue b/src/views/wallet/Studio.vue index 9ff4ebbca..0eaac03a9 100644 --- a/src/views/wallet/Studio.vue +++ b/src/views/wallet/Studio.vue @@ -124,7 +124,6 @@ export default class Studio extends Vue { .subtitle { margin-left: 0.5em; - /*font-size: 20px;*/ color: var(--primary-color-light); font-weight: lighter; } diff --git a/src/views/wallet/Transfer.vue b/src/views/wallet/Transfer.vue index b12366b87..ba52a8277 100644 --- a/src/views/wallet/Transfer.vue +++ b/src/views/wallet/Transfer.vue @@ -729,6 +729,7 @@ export default class Transfer extends Vue { @@ -769,7 +769,7 @@ $padTop: 8px; } .explain { - font-size: 12px; + @include mixins.typography-caption; color: var(--primary-color-light); } h1 { @@ -778,7 +778,7 @@ h1 { h4 { display: block; text-align: left; - font-size: 12px; + @include mixins.typography-caption; font-weight: bold; margin: 12px 0; } @@ -793,7 +793,7 @@ h4 { padding: 5px 6px !important; text-align: center; letter-spacing: 2px; - font-size: 12px; + @include mixins.typography-caption; } .addressIn >>> input::-webkit-input-placeholder { @@ -820,7 +820,7 @@ h4 { } .memo { - font-size: 14px; + @include mixins.typography-caption; background-color: var(--bg-light); resize: none; width: 100%; @@ -835,7 +835,7 @@ h4 { .tx_info { text-align: left; - font-size: 14px; + @include mixins.typography-caption; } .new_order_Form { @@ -865,7 +865,7 @@ h4 { .fees p { text-align: left; - font-size: 13px; + @include mixins.typography-caption; color: var(--primary-color-light); } @@ -875,7 +875,7 @@ h4 { label { color: var(--primary-color-light); - font-size: 12px; + @include mixins.typography-caption; font-weight: bold; margin: 2px 0 !important; } @@ -894,7 +894,7 @@ label { } .err_list { - font-size: 12px; + @include mixins.typography-caption; color: var(--error); margin: 6px 0; } diff --git a/src/views/wallet/Validator.vue b/src/views/wallet/Validator.vue index 55f598c8a..010f1aa4d 100644 --- a/src/views/wallet/Validator.vue +++ b/src/views/wallet/Validator.vue @@ -346,9 +346,7 @@ export default class Validator extends Vue { .subtitle { margin-left: 0.5em; - /*font-size: 20px;*/ color: var(--primary-color-light); - font-weight: lighter; } span { @@ -415,7 +413,7 @@ span { } .cancel { - font-size: 13px; + @include mixins.typography-caption; color: var(--secondary-color); justify-self: flex-end; } From 7347f63e71a23517d9ae82972ac60c1962170959 Mon Sep 17 00:00:00 2001 From: Achraf Eddaqqaq <51858084+aeddaqqa@users.noreply.github.com> Date: Mon, 20 Nov 2023 11:58:40 +0100 Subject: [PATCH 06/10] improvement for create offer form (#336) * improvement for create offer form * fix catching signavault errors * improvement for msg part of create offer --- src/components/CamInput.vue | 8 +- src/components/misc/AvaxInput.vue | 10 +- src/components/misc/CamTooltip.vue | 9 +- .../wallet/earn/CreateOfferForm.vue | 733 ++++++++++++------ src/components/wallet/earn/DepositOffers.vue | 11 +- .../wallet/earn/ModalDepositFunds.vue | 32 +- .../wallet/earn/mountCreateOfferForm.ts | 5 +- src/explorer_api.ts | 15 +- src/helpers/wallet_helper.ts | 10 +- src/locales/en.json | 28 +- src/store/modules/platform/platform.ts | 143 ++-- 11 files changed, 685 insertions(+), 319 deletions(-) diff --git a/src/components/CamInput.vue b/src/components/CamInput.vue index 226d5af10..7bb32ade6 100644 --- a/src/components/CamInput.vue +++ b/src/components/CamInput.vue @@ -43,8 +43,14 @@ export default class CamInput extends Vue { } } - diff --git a/src/components/wallet/earn/DepositOffers.vue b/src/components/wallet/earn/DepositOffers.vue index 57fdcf397..1b9925e21 100644 --- a/src/components/wallet/earn/DepositOffers.vue +++ b/src/components/wallet/earn/DepositOffers.vue @@ -1,7 +1,7 @@ diff --git a/src/components/wallet/earn/ModalAbortSigning.vue b/src/components/wallet/earn/ModalAbortSigning.vue index f90693544..31da33611 100644 --- a/src/components/wallet/earn/ModalAbortSigning.vue +++ b/src/components/wallet/earn/ModalAbortSigning.vue @@ -9,12 +9,12 @@

{{ modalText }}

@@ -24,10 +24,12 @@ import 'reflect-metadata' import { Vue, Component, Prop } from 'vue-property-decorator' import Modal from '../../modals/Modal.vue' import { MultisigWallet } from '@/js/wallets/MultisigWallet' +import CamBtn from '@/components/CamBtn.vue' @Component({ components: { Modal, + CamBtn, }, }) export default class ModalAbortSigning extends Vue { diff --git a/src/components/wallet/earn/Validate/AddValidator.vue b/src/components/wallet/earn/Validate/AddValidator.vue index c46cbb8e4..9f36490b4 100644 --- a/src/components/wallet/earn/Validate/AddValidator.vue +++ b/src/components/wallet/earn/Validate/AddValidator.vue @@ -1,13 +1,6 @@ @@ -274,52 +136,114 @@ export default class ValidatorInfo extends Vue { } .validator_child_card { - height: 100%; + gap: 1rem; + display: flex; + flex-direction: column; } h4 { font-weight: normal; } -.validator_info > div { - display: grid; - grid-template-columns: repeat(5, max-content); - column-gap: 0px; - margin-top: 12px; +.validator_info { + border-radius: var(--border-radius-lg); + border: 1px solid var(--tailwind-slate-slate-600); + background: var(--tailwind-slate-slate-900); +} + +.v-icon { + @include mixins.typography-subtitle-1; + color: var(--tailwind-slate-slate-200); + margin-right: var(--spacing-space-base); +} + +.info_div { + width: 100%; + min-height: 80px; - > div { - position: relative; - padding: 0 24px; - border-right: 2px solid var(--bg-light); + display: flex; + padding: var(--spacing-space-md) var(--spacing-space-base); + align-items: center; + gap: var(--spacing-space-base); + border-right: none; + border-top: 1px solid var(--tailwind-slate-slate-600); - &:first-of-type { - padding-left: 0; + &:first-of-type { + border-top: none; + } + + .infos { + display: flex; + flex-direction: column; + flex: 1; + // justify-content: space-between; + height: 100%; + gap: 0.5rem; + + label { + @include mixins.typography-caption; + font-weight: 400; + color: var(--tailwind-slate-slate-200); } - &:last-of-type { - border: none; + span { + @include mixins.typography-body-2; + font-weight: 600; + color: var(--tailwind-slate-white); } } +} - label { - @include mixins.typography-body-1; - color: var(--primary-color); +@media screen and (min-width: 900px) and (max-width: 1000px) { + .info_div { + width: 100%; } +} - .icon-mdi-camino { - @include mixins.typography-subtitle-1; - color: var(--primary-color); +@media screen and (min-width: 750px) and (max-width: 900px), + screen and (min-width: 1001px) and (max-width: 1550px) { + .info_div { + width: 50%; + border-right: 1px solid var(--tailwind-slate-slate-600); + border-top: none; + + &:nth-child(3), + &:nth-child(4) { + border-top: 1px solid var(--tailwind-slate-slate-600); + } + + &:nth-child(2), + &:nth-child(4) { + border-right: none; + } + } +} + +@media screen and (min-width: 1551px) { + .info_div { + width: 25%; + border-right: 1px solid var(--tailwind-slate-slate-600); + border-top: none; + + &:last-of-type { + border-right: none; + } } } +.alt_validator_info { + display: flex; + flex-wrap: wrap; +} + .disabled_input { display: inline-block; border-radius: var(--border-radius-sm); color: var(--primary-color-light); background-color: var(--bg-light); - padding: 6px 14px; + padding: 10px 14px; white-space: nowrap; - width: 70%; + width: 100%; } .disabled_input:focus-visible { @@ -331,39 +255,16 @@ h4 { } .amt_in { - width: 70%; pointer-events: none; } -.space-div { - display: none; -} - @media screen and (max-width: 900px) { - .validator_info > div { - grid-template-columns: repeat(1, minmax(auto, auto)); - border-right: transparent; - } - - .space-div { - display: block; - } - .disabled_input { width: 100%; } } @media screen and (max-width: 900px) { - .validator_info > div { - grid-template-columns: repeat(1, minmax(auto, auto)); - border-right: transparent; - } - - .space-div { - display: block; - } - .disabled_input { width: 100%; } @@ -374,15 +275,6 @@ h4 { } @media screen and (min-width: 720px) and (max-width: 1440px) { - .validator_info > div { - grid-template-columns: repeat(2, minmax(auto, auto)); - border-right: transparent; - } - - .space-div { - display: none; - } - .disabled_input { width: 100%; } @@ -395,28 +287,4 @@ h4 { .spinner-color { color: var(--primary-color); } - -.refresh_div { - position: relative; - float: right; - margin-top: -5%; - - width: 20px; - height: 20px; - .v-icon { - color: var(--primary-color); - } - - button { - outline: none !important; - } - img { - object-fit: contain; - width: 100%; - } - - .spinner { - color: var(--primary-color) !important; - } -} diff --git a/src/components/wallet/earn/Validate/ValidatorPending.vue b/src/components/wallet/earn/Validate/ValidatorPending.vue index a812ac45a..bef54a5fd 100644 --- a/src/components/wallet/earn/Validate/ValidatorPending.vue +++ b/src/components/wallet/earn/Validate/ValidatorPending.vue @@ -1,12 +1,5 @@