首页和页面缩放调整
This commit is contained in:
@@ -2,8 +2,10 @@
|
||||
@use '../variables' as *;
|
||||
|
||||
.ai-chat {
|
||||
width: 4.0rem;
|
||||
height: 100vh;
|
||||
width: var(--chat-width, 4.0rem);
|
||||
max-width: 4.0rem;
|
||||
min-width: 1.5rem;
|
||||
height: var(--app-height, 100vh);
|
||||
background: #f3f4f6;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -19,12 +21,12 @@
|
||||
justify-content: space-between;
|
||||
background: #0F172B;
|
||||
color: #fff;
|
||||
padding: 0.12rem 0.18rem;
|
||||
font-size: 0.15rem;
|
||||
padding: 0.12rem 0.14rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
border-radius: 0.2rem;
|
||||
margin: 0.15rem;
|
||||
margin: 0.15rem;
|
||||
height: 0.41rem;
|
||||
}
|
||||
|
||||
|
||||
@@ -5,8 +5,8 @@
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
height: var(--app-height, 100vh);
|
||||
z-index: 2000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -691,7 +691,7 @@
|
||||
position: relative;
|
||||
background: $bg-white;
|
||||
width: 10.4rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -1021,8 +1021,8 @@
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
height: var(--app-height, 100vh);
|
||||
background: $overlay-bg;
|
||||
z-index: 3000;
|
||||
display: flex;
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 6.2rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
background: $bg-white;
|
||||
z-index: 2001;
|
||||
box-shadow: -0.04rem 0 0.2rem rgba(0, 0, 0, 0.1);
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 8rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
background: $bg-main;
|
||||
z-index: 2001;
|
||||
display: flex;
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 8rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
background: $bg-main;
|
||||
z-index: 2001;
|
||||
display: flex;
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 2rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
background: #1a1a2e;
|
||||
color: #fff;
|
||||
padding: 0.2rem 0.12rem;
|
||||
@@ -107,8 +107,8 @@
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
height: var(--app-height, 100vh);
|
||||
background: $overlay-bg;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
|
||||
// ==================== 求职助手页面样式 ====================
|
||||
.agent-page {
|
||||
min-height: 100vh;
|
||||
min-height: var(--app-height, 100vh);
|
||||
background: $bg-main;
|
||||
font-size: 0.14rem;
|
||||
// 主内容区域（左侧导航栏右边的部分）
|
||||
@@ -12,7 +12,7 @@
|
||||
flex: 1;
|
||||
padding: 0.3rem 0.4rem;
|
||||
overflow-y: auto;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@@ -216,7 +216,7 @@
|
||||
border-radius: 0.12rem;
|
||||
border: 1px solid $border-color;
|
||||
padding: 0.24rem;
|
||||
max-height: calc(100vh - 1.4rem);
|
||||
max-height: calc(var(--app-height, 100vh) - 1.4rem);
|
||||
overflow-y: auto;
|
||||
|
||||
// 自定义滚动条
|
||||
@@ -855,7 +855,7 @@
|
||||
// 左侧主区域
|
||||
&__left {
|
||||
flex: 1;
|
||||
height: calc(100vh - 0.6rem);
|
||||
height: calc(var(--app-height, 100vh) - 0.6rem);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 8rem;
|
||||
@@ -864,7 +864,7 @@
|
||||
// 右侧匹配岗位面板
|
||||
&__right {
|
||||
flex: 1;
|
||||
height: calc(100vh - 0.6rem);
|
||||
height: calc(var(--app-height, 100vh) - 0.6rem);
|
||||
margin-left: 0.2rem;
|
||||
max-width: 8rem;
|
||||
overflow-y: auto;
|
||||
|
||||
@@ -14,6 +14,7 @@
|
||||
font-family: system-ui, -apple-system, sans-serif;
|
||||
// 全局基础行高重置，防止 1rem=100px 导致子元素继承异常行高
|
||||
line-height: 1.5;
|
||||
font-size: 0.14rem;
|
||||
|
||||
// ==================== 顶部导航栏 ====================
|
||||
.home-nav {
|
||||
@@ -25,15 +26,23 @@
|
||||
&__inner {
|
||||
width: 12rem;
|
||||
margin: 0 auto;
|
||||
height: 0.68rem;
|
||||
height: 0.72rem;
|
||||
padding: 0.2rem;
|
||||
box-sizing: border-box;
|
||||
border-radius: 40px;
|
||||
background: #FFFFFF;
|
||||
border: 0.01rem solid #FFFFFF;
|
||||
border-radius: 0.24rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
&--scorlled {
|
||||
position: fixed;
|
||||
top: 0.2rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 100;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 0 32px 0 rgba(10, 20, 21, .06);
|
||||
}
|
||||
}
|
||||
|
||||
// Logo 区域
|
||||
@@ -61,7 +70,7 @@
|
||||
// 导航右侧 CTA 按钮
|
||||
&__btn {
|
||||
padding: 0.1rem 0.32rem;
|
||||
border-radius: 9999px;
|
||||
border-radius: 0.16rem;
|
||||
background: #111;
|
||||
color: #fff;
|
||||
font-size: 0.14rem;
|
||||
@@ -126,14 +135,14 @@
|
||||
// 左侧文字区
|
||||
&__left {
|
||||
flex-shrink: 0;
|
||||
max-width: 5.5rem;
|
||||
//width: 5.8rem;
|
||||
}
|
||||
|
||||
// 主标题
|
||||
&__title {
|
||||
font-size: 0.72rem;
|
||||
font-size: 0.54rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.9rem;
|
||||
line-height: 0.71rem;
|
||||
letter-spacing: -0.03rem;
|
||||
color: #111;
|
||||
margin: 0;
|
||||
@@ -144,37 +153,55 @@
|
||||
font-size: 0.2rem;
|
||||
line-height: 0.325rem;
|
||||
color: #9ca3af;
|
||||
margin-top: 0.2rem;
|
||||
max-width: 4.74rem;
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
|
||||
// 免费体验按钮
|
||||
&__cta {
|
||||
margin-top: 0.4rem;
|
||||
padding: 0.2rem 0.56rem;
|
||||
border-radius: 9999px;
|
||||
background: $accent;
|
||||
margin-top: 0.69rem;
|
||||
width: 1.84rem;
|
||||
height: 0.56rem;
|
||||
//line-height: 0.24rem;
|
||||
border-radius: 0.16rem;
|
||||
background: linear-gradient(90deg, rgba(82, 202, 209, 1) 0%, rgba(83, 217, 200, 1) 100%);
|
||||
color: #fff;
|
||||
font-size: 0.18rem;
|
||||
line-height: 0.28rem;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 25px 50px -12px rgba(82, 202, 209, 0.2);
|
||||
transition: background 0.2s;
|
||||
&:hover { background: $accent-hover; }
|
||||
}
|
||||
|
||||
// 右侧卡片区
|
||||
&__right {
|
||||
flex-shrink: 0;
|
||||
box-shadow: 0px 0px 15.45px rgba(82, 202, 209, 0.1);
|
||||
border-radius: 0.16rem;
|
||||
}
|
||||
|
||||
&__right-top{
|
||||
height: 0.5rem;
|
||||
background: #fff;
|
||||
border-radius: 0.16rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.06rem;
|
||||
padding-left: 0.3rem;
|
||||
>div{
|
||||
height: 0.08rem;
|
||||
width: 0.08rem;
|
||||
border-radius: 50%;
|
||||
background: #52CAD1;
|
||||
}
|
||||
}
|
||||
|
||||
// 视频播放器 — 16:9 比例，圆角，无控件
|
||||
&__video {
|
||||
width: 6.5rem;
|
||||
aspect-ratio: 16 / 9;
|
||||
border-radius: 0.24rem;
|
||||
width: 5.16rem;
|
||||
height: 2.90rem;
|
||||
//aspect-ratio: 16 / 9;
|
||||
border-radius: 0.16rem;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
@@ -313,7 +340,7 @@
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.015rem;
|
||||
line-height: 0.7rem;
|
||||
line-height: 0.63rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -322,8 +349,8 @@
|
||||
width: 0.8rem;
|
||||
height: 0.06rem;
|
||||
border-radius: 9999px;
|
||||
background: rgba(82, 202, 209, 0.3);
|
||||
margin-top: 0.2rem;
|
||||
background: #52CAD1;
|
||||
margin-top: 0.53rem;
|
||||
}
|
||||
|
||||
// 三个统计卡片横向排列
|
||||
@@ -336,23 +363,25 @@
|
||||
// 单个统计卡片
|
||||
.stat-card {
|
||||
background: #fff;
|
||||
border-radius: 0.48rem;
|
||||
padding: 0.5rem;
|
||||
border-radius: 0.16rem;
|
||||
width: 2.03rem;
|
||||
height: 1.87rem;
|
||||
text-align: center;
|
||||
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
|
||||
padding-top:0.38rem;
|
||||
box-shadow: 0 0.06rem 0.2rem rgba(0, 0, 0, 0.05);
|
||||
|
||||
// 大数字
|
||||
&__num {
|
||||
font-size: 0.64rem;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 900;
|
||||
color: $accent;
|
||||
line-height: 0.85rem;
|
||||
color: #52CAD1;
|
||||
line-height: 0.63rem;
|
||||
}
|
||||
|
||||
// 描述文字
|
||||
&__label {
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.2rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.22rem;
|
||||
color: #9ca3af;
|
||||
margin-top: 0.12rem;
|
||||
letter-spacing: 0.0035rem;
|
||||
@@ -362,11 +391,42 @@
|
||||
// ==================== 岗位展示区 ====================
|
||||
.home-jobs-showcase {
|
||||
padding: 1rem 0;
|
||||
background: rgba(82, 202, 209, 0.05);
|
||||
background: linear-gradient(to top, rgba(82, 202, 209, 0.05), rgba(82, 202, 209, 0.0001));
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
|
||||
// 背景色块 — 定位实现
|
||||
&__orb {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
|
||||
// 顶部小块 — 类似 hero 底部色块
|
||||
&--top {
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: -3rem;
|
||||
width: 5rem;
|
||||
height: 2.5rem;
|
||||
border-radius: 3.5rem;
|
||||
background: rgba(82, 202, 209, 0.3);
|
||||
filter: blur(1.2rem);
|
||||
}
|
||||
|
||||
// 底部全宽 — 从底部向上渐变透明
|
||||
&--bottom {
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 7rem;
|
||||
background: linear-gradient(to top, rgba(82, 202, 209, 0.08), transparent);
|
||||
}
|
||||
}
|
||||
|
||||
// 内容容器
|
||||
&__inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 12rem;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
@@ -407,11 +467,16 @@
|
||||
|
||||
// 岗位滚动卡片容器
|
||||
&__scroll {
|
||||
display: flex;
|
||||
gap: 0.16rem;
|
||||
overflow-x: auto;
|
||||
padding-bottom: 0.1rem;
|
||||
&::-webkit-scrollbar { display: none; }
|
||||
overflow: hidden;
|
||||
>div{
|
||||
display: flex;
|
||||
gap: 0.16rem;
|
||||
overflow-x: auto;
|
||||
padding-bottom: 0.1rem;
|
||||
&::-webkit-scrollbar { display: none; }
|
||||
margin-left: -1.2rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -440,7 +505,7 @@
|
||||
backdrop-filter: blur(36px);
|
||||
border-radius: 0.12rem;
|
||||
padding: 0.2rem 0.24rem;
|
||||
min-width: 2.8rem;
|
||||
min-width: 2.6rem;
|
||||
text-align: left;
|
||||
|
||||
// 公司名 + 时间
|
||||
@@ -481,9 +546,9 @@
|
||||
min-width: 0;
|
||||
|
||||
h2 {
|
||||
font-size: 0.52rem;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.65rem;
|
||||
line-height: 0.63rem;
|
||||
color: #111;
|
||||
margin: 0;
|
||||
}
|
||||
@@ -492,22 +557,21 @@
|
||||
font-size: 0.2rem;
|
||||
line-height: 0.325rem;
|
||||
color: #999;
|
||||
margin-top: 0.24rem;
|
||||
max-width: 4.5rem;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
}
|
||||
|
||||
// 深色圆角按钮（带图标）
|
||||
&__btn {
|
||||
margin-top: 0.4rem;
|
||||
margin-top: 0.73rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.12rem;
|
||||
padding: 0.2rem 0.4rem;
|
||||
border-radius: 9999px;
|
||||
padding: 0.15rem 0.4rem;
|
||||
border-radius: 0.16rem;
|
||||
background: #111111;
|
||||
color: #fff;
|
||||
font-size: 0.18rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.28rem;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
@@ -530,8 +594,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(157.19deg, #E8F8F9 0%, #FBFDF7 100%);
|
||||
border-radius: 0.48rem;
|
||||
background: linear-gradient(136.66deg, #E8F8F9 0%, #FBFDF7 100%);
|
||||
border-radius: 0.16rem;
|
||||
padding: 0.48rem;
|
||||
min-height: 3.87rem;
|
||||
}
|
||||
@@ -568,7 +632,7 @@
|
||||
width: 0.64rem;
|
||||
height: 0.64rem;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(135deg, $accent, #a7f3d0);
|
||||
//background: linear-gradient(135deg, $accent, #a7f3d0);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -590,7 +654,7 @@
|
||||
span {
|
||||
font-size: 0.1rem;
|
||||
line-height: 0.15rem;
|
||||
background: rgba(82, 202, 209, 0.15);
|
||||
background: rgba(82, 202, 209, 0.2);
|
||||
color: $accent;
|
||||
padding: 0.02rem 0.08rem;
|
||||
border-radius: 0.04rem;
|
||||
@@ -602,11 +666,10 @@
|
||||
margin-left: auto;
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
padding: 0.12rem 0.16rem;
|
||||
padding: 0.12rem 0.11rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
// 骨架进度条 — block 自然纵排，无需 flex-direction: column
|
||||
@@ -614,7 +677,7 @@
|
||||
.bar {
|
||||
height: 0.08rem;
|
||||
border-radius: 9999px;
|
||||
background: #e5e7eb;
|
||||
background: #F3F4F6;
|
||||
&--full { width: 100%; }
|
||||
&--3q { width: 75%; margin-top: 0.1rem; }
|
||||
}
|
||||
@@ -626,11 +689,10 @@
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 0.16rem;
|
||||
padding: 0.15rem;
|
||||
border-radius: 0.16rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.24rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -719,7 +781,6 @@
|
||||
&__title {
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.2rem;
|
||||
//font-weight: 600;
|
||||
color: #111;
|
||||
margin: 0;
|
||||
}
|
||||
@@ -735,7 +796,7 @@
|
||||
|
||||
@keyframes pulse {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.5; }
|
||||
50% { opacity: 0.6; }
|
||||
}
|
||||
|
||||
// ---- 功能3：简历文档模拟卡片 ----
|
||||
@@ -812,7 +873,7 @@
|
||||
background: #e5e7eb;
|
||||
border-radius: 0.02rem;
|
||||
&--half { width: 50%; }
|
||||
&--third { width: 33%; margin-top: 0.05rem; }
|
||||
&--third { width: 33%; margin-top: 0.05rem;background: #F3F4F6 }
|
||||
}
|
||||
|
||||
// 简历内容条占位 — block 自然纵排
|
||||
@@ -875,7 +936,7 @@
|
||||
&__role {
|
||||
font-size: 0.11rem;
|
||||
line-height: 0.156rem;
|
||||
font-weight: 900;
|
||||
font-weight: 500;
|
||||
color: #111;
|
||||
margin: 0.03rem 0 0;
|
||||
}
|
||||
@@ -916,7 +977,7 @@
|
||||
border: 0.9px solid rgba(255, 255, 255, 0.5);
|
||||
box-shadow: 0 18px 46px rgba(0, 0, 0, 0.03);
|
||||
backdrop-filter: blur(66px);
|
||||
border-radius: 0.32rem;
|
||||
border-radius: 0.16rem;
|
||||
border-top-left-radius: 0;
|
||||
color: #111;
|
||||
}
|
||||
@@ -925,7 +986,7 @@
|
||||
&--user {
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
border-radius: 0.32rem;
|
||||
border-radius: 0.16rem;
|
||||
border-top-right-radius: 0;
|
||||
margin-left: auto;
|
||||
box-shadow: 0 4px 14px rgba(82, 202, 209, 0.2);
|
||||
@@ -1024,15 +1085,17 @@
|
||||
&__cards {
|
||||
display: flex;
|
||||
gap: 0.24rem;
|
||||
justify-content: center;
|
||||
width: 12rem;
|
||||
margin: 0 auto;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0.48rem;
|
||||
}
|
||||
|
||||
// 创始人引言深色卡片
|
||||
&__founder {
|
||||
width: 12rem;
|
||||
background: #1a1a2e;
|
||||
border-radius: 0.48rem;
|
||||
background: #111;
|
||||
border-radius: 0.16rem;
|
||||
padding: 0.48rem 0.6rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -1044,8 +1107,8 @@
|
||||
// 创始人装饰圆环 SVG
|
||||
&__founder-decor {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
right: -0.6rem;
|
||||
bottom: -4.6rem;
|
||||
transform: translateY(-50%);
|
||||
width: 4.55rem;
|
||||
height: 4.55rem;
|
||||
@@ -1128,11 +1191,14 @@
|
||||
// 单个评价卡片
|
||||
.testimonial-card {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
min-width: 0;
|
||||
max-width: 3.71rem;
|
||||
background: #fff;
|
||||
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 0.4rem;
|
||||
border-radius: 0.16rem;
|
||||
padding: 0.3rem;
|
||||
position: relative;
|
||||
|
||||
@@ -1157,7 +1223,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.16rem;
|
||||
margin-top: 0.3rem;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
|
||||
// 作者头像
|
||||
@@ -1166,8 +1232,6 @@
|
||||
height: 0.48rem;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
border: 2px solid #fff;
|
||||
box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.1);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -1246,8 +1310,8 @@
|
||||
.filter-btn {
|
||||
height: 0.48rem;
|
||||
padding: 0 0.4rem;
|
||||
border-radius: 0.24rem;
|
||||
background: $accent;
|
||||
border-radius: 0.16rem;
|
||||
background: #111;
|
||||
color: #fff;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.26rem;
|
||||
@@ -1255,7 +1319,7 @@
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
&:hover { background: $accent-hover; }
|
||||
&:hover { }
|
||||
}
|
||||
|
||||
// ==================== 常见问题（FAQ） ====================
|
||||
@@ -1348,33 +1412,32 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 悬停态 — 图标变品牌色
|
||||
// 悬停态
|
||||
&:hover {
|
||||
.faq-item__icon {
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
background: #f3f4f6;
|
||||
color: #1f2937;
|
||||
}
|
||||
}
|
||||
|
||||
// 展开态 — 图标变品牌色
|
||||
// 展开态
|
||||
&--open {
|
||||
.faq-item__icon {
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
background: #f3f4f6;
|
||||
color: #1f2937;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 底部 CTA 行动号召 ====================
|
||||
.home-cta {
|
||||
padding: 0 1.2rem 1.2rem;
|
||||
width: 12rem;
|
||||
margin: 0 auto;
|
||||
padding: 0 0 1.2rem;
|
||||
width: 100%;
|
||||
|
||||
// CTA 内容区
|
||||
&__inner {
|
||||
background: linear-gradient(223.56deg, #52CAD1 0%, #53D9C8 100%);
|
||||
border-radius: 0.6rem;
|
||||
border-radius: 0;
|
||||
padding: 1.0rem 0;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
@@ -1393,9 +1456,9 @@
|
||||
|
||||
// CTA 按钮
|
||||
&__btn {
|
||||
margin-top: 0.2rem;
|
||||
padding: 0.24rem 0.64rem;
|
||||
border-radius: 9999px;
|
||||
margin-top: 0.4rem;
|
||||
padding: 0.18rem 0.64rem;
|
||||
border-radius: 0.16rem;
|
||||
background: #111;
|
||||
color: #fff;
|
||||
font-size: 0.2rem;
|
||||
|
||||
@@ -4,10 +4,10 @@
|
||||
.job-detail {
|
||||
&__content {
|
||||
margin-left: 2rem;
|
||||
margin-right: 3.6rem;
|
||||
margin-right: var(--chat-width, 4.0rem);
|
||||
flex: 1;
|
||||
padding: 0.12rem 0.56rem 0.12rem 0.18rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
background: $bg-main;
|
||||
|
||||
@@ -5,10 +5,10 @@
|
||||
.jobs-page {
|
||||
&__content {
|
||||
margin-left: 2rem;
|
||||
margin-right: 4.0rem;
|
||||
margin-right: var(--chat-width, 4.0rem);
|
||||
flex: 1;
|
||||
padding: 0.12rem 0.18rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
background: $bg-main;
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
margin-left: 2rem;
|
||||
flex: 1;
|
||||
padding: 0.12rem 0.36rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
background: $bg-main;
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
margin-left: 2rem;
|
||||
flex: 1;
|
||||
padding: 0.12rem 0.36rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
background: $bg-main;
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
margin-left: 2rem;
|
||||
flex: 1;
|
||||
padding: 0.12rem 0.36rem;
|
||||
height: 100vh;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
background: $bg-main;
|
||||
|
||||
@@ -27,7 +27,8 @@ $text-light: #BFBFBF;
|
||||
$text-middle: #777777;
|
||||
|
||||
// 强调色 / 品牌色
|
||||
$accent: #4FC2C9;
|
||||
//$accent: #4FC2C9;
|
||||
$accent: #52CAD1;
|
||||
|
||||
// 强调色悬停态
|
||||
$accent-hover: #42A8B3;
|
||||
@@ -42,7 +43,7 @@ $border-color: #E8E8E8;
|
||||
$overlay-bg: rgba(0, 0, 0, 0.5);
|
||||
|
||||
// 主按钮颜色背景（确认提交等）
|
||||
$btn-dark: #4FC2C9;
|
||||
$btn-dark: #52CAD1;
|
||||
|
||||
// 主按钮颜色悬停态
|
||||
$btn-dark-hover: #42A8B3;
|
||||
@@ -54,4 +55,4 @@ $btn-dark-hover: #42A8B3;
|
||||
//$btn-dark-hover: #2E3142;
|
||||
|
||||
// 渐变色背景
|
||||
$gradient-bg: linear-gradient(to right, #4FC2C9, #42A8B3);
|
||||
$gradient-bg: linear-gradient(to right, #52CAD1, #42A8B3);
|
||||
|
||||
Reference in New Issue
Block a user