优化样式 新增版本号

This commit is contained in:
gyq
2024-03-07 16:15:03 +08:00
parent 4a5b52fa45
commit 31ef882431
16 changed files with 291 additions and 186 deletions

View File

@@ -12,7 +12,8 @@
<span class="n">{{ props.amount }}</span>
</div>
<div class="input">
<el-input ref="inputRef" v-model="scanCode" style="height: 80px;" placeholder="请扫描付款码"
<el-input ref="inputRef" v-model="scanCode"
style="height: calc(var(--el-component-size-large) + 20px);" placeholder="请扫描付款码"
@keydown.enter="enterHandle" clearable></el-input>
</div>
<div class="number_warp">
@@ -26,7 +27,7 @@
</div>
</div>
<div class="btn">
<el-button type="primary" style="width: 100%;height: 60px;" v-loading="loading"
<el-button type="primary" style="width: 100%;" v-loading="loading"
@click="submitHandle">立即支付</el-button>
</div>
</div>
@@ -184,43 +185,43 @@ defineExpose({
.right {
flex: 1;
padding: 0 20px;
padding: 0 var(--el-font-size-base);
.amount {
display: flex;
height: 80px;
height: calc(var(--el-component-size-large) + 20px);
display: flex;
align-items: center;
justify-content: space-between;
color: var(--primary-color);
background-color: #555;
border-radius: 6px;
padding: 0 20px;
font-size: 30px;
padding: 0 var(--el-font-size-base);
font-size: calc(var(--el-font-size-base) + 10px);
}
.input {
padding: 20px 0;
padding: var(--el-font-size-base) 0;
:deep(.el-input__inner) {
font-size: 30px;
font-size: calc(var(--el-font-size-base) + 10px);
}
}
.number_warp {
--h: 70px;
--h: 40px;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: var(--h) var(--h) var(--h) var(--h);
gap: 20px;
gap: var(--el-font-size-base);
.item {
background-color: #dddddd;
display: flex;
align-items: center;
justify-content: center;
font-size: 30px;
border-radius: 6px;
font-size: calc(var(--el-font-size-base) + 10px);
border-radius: 4px;
&.disabled {
color: #999;
@@ -245,7 +246,7 @@ defineExpose({
.pay_wait {
flex: 1;
padding: 0 20px;
padding: 0 var(--el-font-size-base);
height: 600px;
padding-bottom: 100px;
display: flex;
@@ -265,7 +266,7 @@ defineExpose({
.btn {
width: 200px;
padding-top: 20px;
padding-top: var(--el-font-size-base);
}
}
}