aidlab/lanecarford_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 样式修改

Browse Source
This commit is contained in:
zhangyahui
2025-12-01 11:30:31 +08:00
parent 5d6ad32c80
commit 81df571ddf
11 changed files with 70 additions and 270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/views/asistant/components/InputArea.vue
View File

@@ -296,7 +296,7 @@ const stopRecording = () => {
.shortcut-item {
font-size: 4.2rem;
width: fit-content;
font-family: 'robotoBold';
font-family: 'robotoRegular';
white-space: nowrap;
height: 8.1rem;
line-height: 8.1rem;
@@ -351,7 +351,7 @@ const stopRecording = () => {
outline: none;
background: transparent;
font-size: 4rem;
font-family: 'robotoBold';
font-family: 'robotoRegular';
font-weight: 400;
line-height: 4.8rem; /* 设置行高等于实际渲染高度，实现垂直居中 */
padding: 0;
@@ -362,7 +362,7 @@ const stopRecording = () => {
color: #888;
letter-spacing: -0.01em;
font-weight: 400;
font-family: 'robotoBold';
font-family: 'robotoRegular';
word-spacing: -5px;
line-height: 4.8rem;
}
@@ -405,7 +405,7 @@ const stopRecording = () => {
}
.recording-text {
font-family: 'robotoBold';
font-family: 'robotoRegular';
font-size: 2.8rem;
color: #6d6868;
letter-spacing: 0.02em;

4
src/views/asistant/components/NoticeItem.vue
View File

@@ -97,11 +97,11 @@ const actionList: ActionItem[] = [
align-items: flex-start;
.message-text {
font-size: 4.2rem;
font-family: 'robotoBold';
font-family: 'robotoRegular';
line-height: 121%;
font-weight: 400;
background-color: #efefef;
padding: 4.95rem 3.95rem;
padding: 3.43rem 4.35rem;
}
&.user-message {

14
src/views/login/LoginPage.vue
View File

@@ -2,7 +2,7 @@
<div class="login-page">
<div class="content">
<div class="back-button" @click="goBack">
<img src="@/assets/images/arrow_left.png" class="back-icon" />
<SvgIcon name="left" size="50" color="#fff" />
</div>
<div class="header">
@@ -176,22 +176,16 @@ const handleSignup = () => {
}
.back-button {
// position: absolute;
// top: 2rem;
// left: 2rem;
margin-top: 2.4rem;
margin-left: 6.1rem;
width: 2rem;
height: 3.4rem;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 3;
font-size: 3.4rem;
.back-icon {
width: 2.83rem;
height: 3.47rem;
.c-svg{
width: initial;
height: initial;
}
}

2
src/views/login/WelcomePage.vue
View File

@@ -72,7 +72,7 @@ const goToLogin = () => {
border: 1px solid #fff;
text-align: center;
// padding: 2rem 1.3rem;
box-sizing: content-box;
box-sizing: border-box;
font-family: 'satoshiRegular';
}
}

53
src/views/stylist/customer.vue
View File

@@ -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>

6
src/views/stylist/dressfor.vue
View File

@@ -169,6 +169,10 @@ onUnmounted(() => {
})
</script>
<style lang="less" scoped>
.c-svg{
width: initial;
height: initial;
}
.dressfor-container {
height: calc(100vh - 12rem - 14.9rem);
overflow: hidden;
@@ -203,7 +207,7 @@ onUnmounted(() => {
width: 59.8rem;
height: 100%;
background-color: #fff;
border: 2px solid #5f5f5f;
// border: 2px solid #5f5f5f;
border-radius: 1rem;
color: #222222;
font-size: 3.2rem;

29
src/views/stylist/index.vue
View File

@@ -10,9 +10,8 @@
<div class="carousel-container" v-show="!showVideo">
<div class="nav-arrow left" @click="handleChangeSwiper('prev')">
<!-- <van-icon name="arrow-left" color="#fff" /> -->
<SvgIcon name="left" size="70" color="#fff" />
<SvgIcon name="left" size="70" color="#fff" />
</div>
<van-swipe touchable ref="swiperRef" @change="handleChangeCurrent">
@@ -30,7 +29,7 @@
</van-swipe>
<div class="nav-arrow right" @click="handleChangeSwiper('next')">
<van-icon name="arrow" color="#fff" />
<SvgIcon class="arrow-right" name="left" size="70" color="#fff" />
</div>
</div>
</div>
@@ -103,7 +102,6 @@ const swiperRef = ref<any>(null)
const showVideo = ref<boolean>(false)
const videoRef = ref<any>(null)
const handleChangeCurrent = (index: number) => {
currentChoosed.value = stylists.value[index].id
}
@@ -118,7 +116,7 @@ const handleChangeSwiper = (type: 'next' | 'prev') => {
const handleClickStylist = (item: any) => {
console.log(item)
// showVideo.value = true
// showVideo.value = true
}
const handleContinue = () => {
@@ -202,13 +200,16 @@ watch(showVideo, (newValue) => {
z-index: 3;
box-shadow: 0 2rem 2.5rem rgba(0, 0, 0, 0.25), 0 0 6rem rgba(0, 0, 0, 0.25);
border: 0.1rem solid rgba(255, 255, 255, 0.2);
filter: drop-shadow(.2rem 4px 6.6px rgba(0, 0, 0, 0.25));
filter: drop-shadow(0.2rem 4px 6.6px rgba(0, 0, 0, 0.25));
&.left {
left: 1rem;
}
&.right {
right: 1rem;
.arrow-right {
transform: rotate(180deg);
}
}
}
@@ -219,7 +220,7 @@ watch(showVideo, (newValue) => {
.swiper-container {
width: 66rem;
height: 100rem;
border: .2rem solid #fff;
border: 0.2rem solid #fff;
border-radius: 1.2rem;
display: flex;
flex-direction: column;
@@ -281,11 +282,13 @@ watch(showVideo, (newValue) => {
}
.continue-button {
height: 5.9rem;
box-sizing: border-box;
position: absolute;
bottom: 6.4rem;
right: 7.6rem;
padding: 1.2rem 2.4rem;
border: 1px solid #fff;
padding: 0 3.4rem;
border: 0.3rem solid #fff;
border-radius: 1rem;
color: white;
font-size: 4rem;
@@ -293,6 +296,8 @@ watch(showVideo, (newValue) => {
cursor: pointer;
z-index: 3;
font-family: 'satoshiRegular';
display: flex;
align-items: center;
}
:deep(.van-overlay) {
@@ -326,12 +331,6 @@ watch(showVideo, (newValue) => {
inset 0 -0.2rem 0.4rem rgba(0, 0, 0, 0.3);
transition: all 0.3s ease;
&:hover {
transform: translateY(-0.2rem);
box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.5),
inset 0 0.2rem 0.4rem rgba(255, 255, 255, 0.15), inset 0 -0.2rem 0.4rem rgba(0, 0, 0, 0.4);
}
.close-icon {
color: white;
font-size: 3.64rem;

3
src/views/stylist/sex.vue
View File

@@ -6,7 +6,7 @@
<div class="select-list">
<div
class="option"
class="option flex flex-center"
v-for="option in options"
:key="option.value"
@click="handleSelect(option.value)"
@@ -76,6 +76,7 @@ const handleSelect = (value: string) => {
font-family: 'satoshiRegular';
font-size: 6.4rem;
width: 29.7rem;
height: 8.3rem;
border: .2rem solid #fff;
}
}