style: 样式修改
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<div class="customer-container safe-area-top" :class="{ 'form-mode': pageMode === 'form' }">
|
||||
<template v-if="pageMode === 'entry'">
|
||||
<div class="setting flex flex-between">
|
||||
<SvgIcon name="left" size="70" @click="handleBack" />
|
||||
<SvgIcon name="left" size="70" @click="handleBack" />
|
||||
|
||||
<SvgIcon name="setting" size="70" />
|
||||
</div>
|
||||
@@ -13,13 +13,17 @@
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="form-container">
|
||||
<div class="back-container flex flex-center" @click="handleBack">
|
||||
<SvgIcon name="left" size="70" @click="handleBack" />
|
||||
<div class="menu flex flex-between">
|
||||
<div class="back-container flex flex-between" @click="handleBack">
|
||||
<SvgIcon name="left" size="70" @click="handleBack" />
|
||||
</div>
|
||||
<SvgIcon name="setting" size="70" />
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="form-title">Customer ID</div>
|
||||
<div class="description">
|
||||
Redefine the styling experience with AI. Use<br />Styling Angel to speed up your fashion<br />journey.
|
||||
Redefine the styling experience with AI. Use<br />Styling Angel to speed up your
|
||||
fashion<br />journey.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -149,25 +153,19 @@ const handleConfirm = async () => {
|
||||
}
|
||||
|
||||
.form-container {
|
||||
.back-container {
|
||||
width: 7.3rem;
|
||||
height: 7.3rem;
|
||||
// border: 0.2rem solid #fff;
|
||||
border-radius: 1.8rem;
|
||||
font-size: 4.3rem;
|
||||
// background: rgba(0, 0, 0, 0.2);
|
||||
// backdrop-filter: blur(20px);
|
||||
// -webkit-backdrop-filter: blur(20px);
|
||||
// -moz-backdrop-filter: blur(20px);
|
||||
// -ms-backdrop-filter: blur(20px);
|
||||
// -o-backdrop-filter: blur(20px);
|
||||
margin-left: 7rem;
|
||||
position: relative;
|
||||
// box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1), inset 0 1px 0 #000000;
|
||||
.menu {
|
||||
padding: 0 4.8rem 0 8.4rem;
|
||||
.back-container {
|
||||
width: 7.3rem;
|
||||
height: 7.3rem;
|
||||
border-radius: 1.8rem;
|
||||
font-size: 4.3rem;
|
||||
position: relative;
|
||||
|
||||
.back-icon {
|
||||
width: 2.08rem;
|
||||
height: 3.47rem;
|
||||
.back-icon {
|
||||
width: 2.08rem;
|
||||
height: 3.47rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.text {
|
||||
@@ -193,8 +191,8 @@ const handleConfirm = async () => {
|
||||
border: 0.2rem solid #ffffff;
|
||||
border-radius: 4.7rem;
|
||||
margin: 0 14.2rem;
|
||||
// padding: 8.2rem 7.9rem;
|
||||
padding: 11rem 7.5rem;
|
||||
// padding: 8.2rem 7.9rem;
|
||||
padding: 11rem 7.5rem;
|
||||
margin-top: 11rem;
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.1);
|
||||
display: flex;
|
||||
@@ -206,10 +204,10 @@ const handleConfirm = async () => {
|
||||
rgba(0, 0, 0, 0) 100%
|
||||
);
|
||||
backdrop-filter: blur(35px);
|
||||
justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
|
||||
.form-field {
|
||||
margin-bottom: 6.8rem;
|
||||
margin-bottom: 6.8rem;
|
||||
&.email {
|
||||
margin-bottom: 6.8rem;
|
||||
}
|
||||
@@ -265,4 +263,7 @@ const handleConfirm = async () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
.c-svg {
|
||||
width: initial;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user