Skip to content

Commit e55cef1

Browse files
committed
Merge remote-tracking branch 'origin' into fix-vue-ui
2 parents 321eb17 + 674e8dd commit e55cef1

20 files changed

Lines changed: 230 additions & 254 deletions

File tree

packages/common/src/components/responsive.less

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -444,7 +444,7 @@
444444
}
445445
}
446446

447-
@media screen and (max-width: 1475px) {
447+
@media screen and (max-width: 1400px) {
448448
.opentiny-design-header {
449449
display: grid;
450450
grid-template-columns: 1fr auto; // 两列:左侧内容 + 右侧nav-right
@@ -627,14 +627,18 @@
627627
}
628628
}
629629

630-
@media (min-width: 1476px) and (max-width: 1576px) {
630+
@media (min-width: 1400px) and (max-width: 1576px) {
631+
631632
.opentiny-design-header {
632633
// 右侧导航
633634
.nav-right {
634635
.dropdown-menu {
635636
.dropdown-content-title {
636637
margin-left: 243px;
637638
}
639+
.dropdown-content .dropdown-app {
640+
width: 216px;
641+
}
638642
}
639643
}
640644
}
@@ -677,6 +681,29 @@
677681
}
678682
}
679683

684+
@media (min-width: 1401px) and (max-width: 1475px) {
685+
.opentiny-design-header {
686+
// 左侧导航
687+
.nav-left {
688+
margin-right: 48px;
689+
}
690+
691+
// 中间导航
692+
.nav-center {
693+
.top-menu {
694+
margin-right: 20px;
695+
}
696+
}
697+
698+
// 右侧导航
699+
.nav-right {
700+
.mg-r {
701+
margin-right: 20px;
702+
}
703+
}
704+
}
705+
}
706+
680707
@media (min-width: 905px) and (max-width: 1045px) {
681708
.opentiny-design-header {
682709
// 右侧导航

packages/home/src/index.less

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ body {
9898
}
9999
}
100100

101-
@media (min-width: 815px) and (max-width: 1476px) {
101+
@media (min-width: 815px) and (max-width: 1400px) {
102102
#app {
103103
margin-top: 67px;
104104
height: calc(100% - 67px);

packages/home/src/views/ai-extension-home/common.less

Lines changed: 7 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -39,11 +39,10 @@
3939

4040
/* 通用文字样式 */
4141
.title {
42+
line-height: 74px;
4243
font-size: 52px;
4344
font-weight: 700;
4445
color: #191919;
45-
letter-spacing: 2px;
46-
line-height: 1.2;
4746
padding-bottom: 32px;
4847
.title-us {
4948
font-size: 56px;
@@ -57,7 +56,6 @@
5756
background: linear-gradient(90deg, #cb43a8 10%, #2c5fef 50%);
5857
-webkit-background-clip: text;
5958
background-clip: text;
60-
letter-spacing: 5px;
6159
-webkit-text-fill-color: transparent;
6260
font-weight: 700;
6361
}
@@ -66,13 +64,11 @@
6664
font-size: 18px;
6765
padding-bottom: 48px;
6866
line-height: 2;
69-
color: #a0a0a0;
70-
letter-spacing: 2px;
71-
font-weight: 400;
67+
color: #595959;
7268
}
7369

7470
.feature-title {
75-
font-size: 36px;
71+
font-size: 40px;
7672
}
7773

7874
/* 按钮样式 */
@@ -84,7 +80,6 @@
8480
text-decoration: none;
8581
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
8682
cursor: pointer;
87-
letter-spacing: 1px;
8883
position: relative;
8984
overflow: hidden;
9085
font-weight: 400;
@@ -94,25 +89,23 @@
9489
background: #191919;
9590
color: white;
9691
border: none;
97-
box-shadow: 0 10px 25px rgba(94, 124, 226, 0.3);
9892
}
9993

10094
.btn.primary:hover {
10195
transform: translateY(-3px);
102-
box-shadow: 0 15px 35px rgba(94, 124, 226, 0.5);
10396
}
10497

10598
.btn.secondary {
99+
font-size: 16px;
106100
background: transparent;
107-
color: #191919;
108-
border: 1px solid #191919;
109-
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
101+
color: #595959;
102+
border: 1px solid #808080;
110103
}
111104

112105
.btn.secondary:hover {
106+
color: #191919;
113107
transform: translateY(-3px);
114108
border-color: #191919;
115-
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
116109
}
117110

118111
/* 动画效果 */
@@ -167,12 +160,10 @@
167160

168161
.title {
169162
font-size: 28px;
170-
letter-spacing: 3px;
171163
}
172164

173165
.subtitle {
174166
font-size: 26px;
175-
letter-spacing: 3px;
176167
}
177168

178169
.description {
@@ -197,13 +188,11 @@
197188

198189
.title {
199190
font-size: 28px;
200-
letter-spacing: 2px;
201191
padding-bottom: 15px;
202192
}
203193

204194
.subtitle {
205195
font-size: 26px;
206-
letter-spacing: 2px;
207196
padding-bottom: 15px;
208197
}
209198

@@ -244,22 +233,19 @@
244233
}
245234

246235
.description {
247-
letter-spacing: 0px;
248236
padding-left: 15px;
249237
padding-right: 15px;
250238
}
251239

252240
.title {
253241
font-size: 22px;
254-
letter-spacing: 1px;
255242
.title-us {
256243
font-size: 24px;
257244
}
258245
}
259246

260247
.subtitle {
261248
font-size: 20px;
262-
letter-spacing: 1px;
263249
}
264250

265251
.feature-title {

packages/home/src/views/ai-extension-home/components/FeatureSection.vue

Lines changed: 5 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,8 @@ const backgroundImageStyle = computed(() => {
2929
:class="{ 'reverse-layout': feature.reverse }"
3030
>
3131
<div class="feature-text">
32-
<h3 class="title">{{ feature.title }}</h3>
33-
<p class="description" v-html="feature.description"></p>
32+
<h3 class="feature-title">{{ feature.title }}</h3>
33+
<p class="feature-desc" v-html="feature.description"></p>
3434
</div>
3535
<div class="feature-visual">
3636
<img
@@ -46,67 +46,7 @@ const backgroundImageStyle = computed(() => {
4646
4747
<style scoped lang="less">
4848
@import "../common.less";
49-
50-
/* FeatureSection 特有样式 */
51-
.feature-section.section {
52-
position: relative;
53-
overflow: hidden;
54-
min-height: 75vh;
55-
}
56-
57-
.feature-content {
58-
margin: 0 auto;
59-
display: flex;
60-
align-items: center;
61-
justify-content: space-between;
62-
column-gap: 100px;
63-
}
64-
65-
.reverse-layout {
66-
flex-direction: row-reverse;
67-
}
68-
69-
.section-title {
70-
font-size: 45px;
71-
font-weight: 700;
72-
margin-bottom: 30px;
73-
color: var(--text-primary);
74-
}
75-
76-
.feature-desc {
77-
font-size: 22px;
78-
line-height: 1.8;
79-
color: var(--text-secondary);
80-
}
81-
82-
.feature-visual {
83-
flex: 1;
84-
display: flex;
85-
justify-content: center;
86-
}
87-
88-
.floating-img {
89-
width: 100%;
90-
filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.15));
91-
border-radius: 24px;
92-
transition: transform 0.3s ease;
93-
}
94-
95-
.floating-img:hover {
96-
transform: scale(1.02);
97-
}
98-
99-
.delay-1 {
100-
animation-delay: 1s;
101-
}
102-
103-
.delay-2 {
104-
animation-delay: 2s;
105-
}
106-
107-
.delay-3 {
108-
animation-delay: 3s;
109-
}
49+
@import "../components/feature-section.less";
11050
11151
/* ==================== 响应式适配 ==================== */
11252
@@ -179,11 +119,11 @@ const backgroundImageStyle = computed(() => {
179119
}
180120
181121
.feature-text {
182-
.title {
122+
.feature-title {
183123
font-size: 20px;
184124
padding-bottom: 12px;
185125
}
186-
.description {
126+
.feature-desc {
187127
font-size: 14px;
188128
}
189129
}

packages/home/src/views/ai-extension-home/components/HeroSection.vue

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -61,13 +61,6 @@ import heroBgPc from "@/assets/images/home/ai-extension-home/banner-img.svg";
6161
display: flex;
6262
justify-content: center;
6363
align-items: center;
64-
65-
img {
66-
filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.15));
67-
border-radius: 20px;
68-
width: 90%;
69-
max-width: 1000px;
70-
}
7164
}
7265
7366
.cta-group {

packages/home/src/views/ai-extension-home/components/HighlightsSection.vue

Lines changed: 3 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -59,8 +59,8 @@ const highlights = [
5959
<template>
6060
<section class="highlights-section section fade-in-up">
6161
<div class="section-container">
62-
<h3 class="text-center title">核心亮点</h3>
63-
<p class="section-description text-center description">AI 助手赋能网页智能交互</p>
62+
<h3 class="text-center highlights-title">核心亮点</h3>
63+
<p class="section-description text-center">AI 助手赋能网页智能交互</p>
6464
<div class="highlights-grid">
6565
<div
6666
v-for="(highlight, index) in highlights"
@@ -80,67 +80,7 @@ const highlights = [
8080

8181
<style scoped lang="less">
8282
@import "../common.less";
83-
84-
.highlights-section {
85-
background: #fff;
86-
}
87-
88-
.highlights-section.section {
89-
position: relative;
90-
overflow: hidden;
91-
min-height: 90vh;
92-
}
93-
94-
.section-container {
95-
max-width: 1400px;
96-
margin: 0 auto;
97-
padding: 0 40px;
98-
}
99-
100-
.highlights-grid {
101-
margin-top: 20px;
102-
display: grid;
103-
grid-template-columns: repeat(4, 1fr);
104-
gap: 30px;
105-
}
106-
107-
.highlight-card {
108-
background: #f8f9fa;
109-
padding: 40px;
110-
border-radius: 16px;
111-
transition: all 0.3s ease;
112-
border: 1px solid transparent;
113-
}
114-
115-
.highlight-card:hover {
116-
transform: translateY(-5px);
117-
background: #fff;
118-
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
119-
}
120-
121-
.card-icon {
122-
width: 48px;
123-
height: 48px;
124-
margin-bottom: 28px;
125-
}
126-
127-
.card-icon img {
128-
width: 100%;
129-
height: 100%;
130-
}
131-
132-
.highlight-card h3 {
133-
font-size: 16px;
134-
font-weight: 600;
135-
margin-bottom: 8px;
136-
}
137-
138-
.highlight-card p {
139-
font-size: 14px;
140-
color: var(--text-secondary);
141-
line-height: 1.5;
142-
}
143-
83+
@import "../components/highlights-section.less";
14484
/* ==================== 响应式适配 ==================== */
14585
14686
@media (max-width: 1200px) {

0 commit comments

Comments
 (0)