hueso/P2Pix-Front-End
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix css and add connectAccount method that run verifyLiquidity after connected

Browse Source
This commit is contained in:
RcleydsonR 2022-11-26 14:07:16 -03:00
parent 4a5d0137ad
commit 246f572550
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/SearchComponent.vue
View File

@ -15,6 +15,11 @@ const enableSelectButton = ref(false);
const hasLiquidity = ref(true); const hasLiquidity = ref(true);
const selectedDeposit = ref(); const selectedDeposit = ref();
const connectAccount = async () => {
await blockchain.connectProvider();
verifyLiquidity()
}
const handleInputEvent = (event: any) => { const handleInputEvent = (event: any) => {
const { value } = event.target; const { value } = event.target;
@ -64,7 +69,7 @@ const emit = defineEmits(["tokenBuy"]);
> >
</div> </div>
<div <div
class="flex flex-col justify-center items-center px-8 py-6 gap-2 rounded-lg shadow-md shadow-gray-600 backdrop-blur-md w-1/3 mt-10" class="blur-container"
> >
<div <div
class="flex flex-col w-full bg-white px-10 py-5 rounded-lg border-y-10" class="flex flex-col w-full bg-white px-10 py-5 rounded-lg border-y-10"
@ -72,17 +77,18 @@ const emit = defineEmits(["tokenBuy"]);
<div class="flex justify-between w-full items-center"> <div class="flex justify-between w-full items-center">
<input <input
type="number" type="number"
class="border-none outline-none text-lg text-gray-900 w-auto" class="border-none outline-none text-lg text-gray-900 w-fit"
v-bind:class="{ v-bind:class="{
'font-semibold': tokenValue != undefined, 'font-semibold': tokenValue != undefined,
'text-xl': tokenValue != undefined, 'text-xl': tokenValue != undefined,
}" }"
@input="debounce(handleInputEvent, 500)($event)" @input="debounce(handleInputEvent, 500)($event)"
placeholder="0 "
step=".01" step=".01"
/> />
<div class="flex flex-row p-2 px-3 bg-gray-300 rounded-full w-fit"> <div class="flex flex-row p-2 px-3 bg-gray-300 rounded-3xl min-w-fit gap-1">
<img alt="Ethereum image" class="mr-3" src="@/assets/brz.svg" /> <img alt="Token image" class="w-fit" src="@/assets/brz.svg" />
<p class="text-gray-900 text-lg">BRZ</p> <span class="text-gray-900 text-lg w-fit" id="brz">BRZ</span>
</div> </div>
</div> </div>
@ -115,7 +121,7 @@ const emit = defineEmits(["tokenBuy"]);
<CustomButton <CustomButton
v-if="!walletAddress" v-if="!walletAddress"
:text="'Conectar carteira'" :text="'Conectar carteira'"
@buttonClicked="blockchain.connectProvider()" @buttonClicked="connectAccount()"
/> />
<CustomButton <CustomButton
v-if="walletAddress" v-if="walletAddress"
@ -150,6 +156,10 @@ const emit = defineEmits(["tokenBuy"]);
@apply text-gray-800 text-center; @apply text-gray-800 text-center;
} }
.blur-container {
@apply flex flex-col justify-center items-center px-8 py-6 gap-2 rounded-lg shadow-md shadow-gray-600 backdrop-blur-md mt-10
}
input[type="number"] { input[type="number"] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }