style: 调整组件间距和样式以优化布局

This commit is contained in:
2025-12-14 20:23:42 +07:00
parent 70f87d07f6
commit 3b13a23982
3 changed files with 8 additions and 8 deletions

View File

@@ -53,7 +53,7 @@ async function onSubmit() {
</ion-toolbar> </ion-toolbar>
</IonHeader> </IonHeader>
<IonContent :fullscreen="true" class="ion-padding"> <IonContent :fullscreen="true" class="ion-padding">
<div class="flex flex-col gap-20px"> <div class="flex flex-col gap-5">
<ui-input-label <ui-input-label
label="Recharge bank card account" label="Recharge bank card account"
model-value="74321329321312" model-value="74321329321312"

View File

@@ -45,7 +45,7 @@ const { user } = useAuth();
</div> </div>
</div> </div>
<div class="ion-margin-top ion-text-center flex gap-24px"> <div class="ion-margin-top ion-text-center flex gap-6">
<ion-button fill="clear"> <ion-button fill="clear">
<ion-icon slot="start" :icon="shareOutline" /> <ion-icon slot="start" :icon="shareOutline" />
Share Share

View File

@@ -33,10 +33,10 @@ onIonViewDidEnter(() => {
</script> </script>
<template> <template>
<div class="mt-20px shadow-md rounded-6px"> <div class="mt-5 shadow-md rounded-md">
<div class="grid grid-cols-2 gap-20px p-20px bg-[var(--ion-card-background)]"> <div class="grid grid-cols-2 gap-5 p-5 bg-(--ion-card-background)">
<div v-for="item in state.balances" :key="item.assetCode" class="flex flex-col gap-4px"> <div v-for="item in state.balances" :key="item.assetCode" class="flex flex-col gap-1">
<div class="ion-text-uppercase text-xs color-text-400 font-500 tracking-0.4px"> <div class="uppercase text-xs text-text-400 font-medium tracking-[0.4px]">
{{ item.assetCode }} {{ item.assetCode }}
</div> </div>
<div class="text-lg font-bold"> <div class="text-lg font-bold">
@@ -45,8 +45,8 @@ onIonViewDidEnter(() => {
</div> </div>
</div> </div>
<div class="px-10px pb-20px bg-[var(--ion-card-background)]"> <div class="px-2.5 pb-5 bg-(--ion-card-background)">
<ion-buttons class="gap-10px" expand="block"> <ion-buttons class="gap-2.5" expand="block">
<ion-button id="open-recharge-modal" expand="block" fill="clear"> <ion-button id="open-recharge-modal" expand="block" fill="clear">
{{ t("wallet.recharge") }} {{ t("wallet.recharge") }}
</ion-button> </ion-button>