Skip to content

Commit 49e20e0

Browse files
fduTristinfduTristin
committed
feat(ui): enhance layout
1 parent bf62e71 commit 49e20e0

File tree

3 files changed

+118
-116
lines changed

3 files changed

+118
-116
lines changed

‎docs/.vitepress/theme/custom.css‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
@import './style/main.css';
66

77
.VPHomeHero .main .text,
8-
.VPHomeHero .main .name span {
8+
.VPHomeHero .main .name.clip {
99
--tw-gradient-from: #99d3fb;
1010
--tw-gradient-via: #a1b8fc;
1111
/* 中间颜色点 */
@@ -23,14 +23,15 @@
2323
@media (min-width: 960px) {
2424

2525
.VPContent .VPHero.has-image .container{
26-
height: 270px;
26+
height: 25vh;
27+
margin-bottom: 5vh;
2728
}
2829

2930
.VPContent .VPHero.has-image .main{
3031
max-width: 900px;
3132
}
3233

33-
.VPHomeHero .main .name {
34+
.VPHomeHero .main .name.clip {
3435
font-size: 80px;
3536
line-height: 120px;
3637
}
@@ -40,7 +41,11 @@
4041
}
4142

4243
.VPContent.is-home {
43-
padding-top: 130px;
44+
padding-top: 10vh;
45+
}
46+
47+
.VPHero .image-container {
48+
transform: translate(-10px, 0.5vh);
4449
}
4550
}
4651

‎docs/.vitepress/theme/style/custom-block.css‎

Lines changed: 109 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,94 +1,115 @@
11
/* .vitepress/theme/style/custom-block.css */
22
/* 深浅色卡 */
33
:root {
4-
--vp-custom-block-info: #cccccc;
5-
--vp-custom-block-info-bg: #fdfdfe;
6-
7-
--vp-custom-block-tip: #009400;
8-
--vp-custom-block-tip-bg: #e6f6e6;
9-
10-
--vp-custom-block-warning: #e6a700;
11-
--vp-custom-block-warning-bg: #fff8e6;
12-
13-
--vp-custom-block-danger: #e13238;
14-
--vp-custom-block-danger-bg: #ffebec;
15-
16-
--vp-custom-block-note: #4cb3d4;
17-
--vp-custom-block-note-bg: #eef9fd;
18-
19-
--vp-custom-block-important: #a371f7;
20-
--vp-custom-block-important-bg: #f4eefe;
21-
22-
--vp-custom-block-details: #3e3e45;
23-
--vp-custom-block-details-bg: #f1f1f1e8;
4+
--vp-custom-block-info: #cccccc;
5+
--vp-custom-block-info-bg: #fdfdfe;
6+
7+
--vp-custom-block-tip: #009400;
8+
--vp-custom-block-tip-bg: #e6f6e6;
9+
10+
--vp-custom-block-warning: #e6a700;
11+
--vp-custom-block-warning-bg: #fff8e6;
12+
13+
--vp-custom-block-danger: #e13238;
14+
--vp-custom-block-danger-bg: #ffebec;
15+
16+
--vp-custom-block-note: #4cb3d4;
17+
--vp-custom-block-note-bg: #eef9fd;
18+
19+
--vp-custom-block-important: #a371f7;
20+
--vp-custom-block-important-bg: #f4eefe;
21+
22+
--vp-custom-block-details: #3e3e45;
23+
--vp-custom-block-details-bg: #f1f1f1e8;
24+
}
25+
26+
.dark {
27+
--vp-custom-block-info: #cccccc;
28+
--vp-custom-block-info-bg: #474748;
29+
30+
--vp-custom-block-tip: #009400;
31+
--vp-custom-block-tip-bg: #003100;
32+
33+
--vp-custom-block-warning: #e6a700;
34+
--vp-custom-block-warning-bg: #4d3800;
35+
36+
--vp-custom-block-danger: #e13238;
37+
--vp-custom-block-danger-bg: #4b1113;
38+
39+
--vp-custom-block-note: #4cb3d4;
40+
--vp-custom-block-note-bg: #193c47;
41+
42+
--vp-custom-block-important: #a371f7;
43+
--vp-custom-block-important-bg: #230555;
44+
45+
--vp-custom-block-details-bg: #ffffff0d;
46+
}
47+
48+
/* 标题字体大小 */
49+
.custom-block-title {
50+
font-size: 16px;
51+
}
52+
53+
/* 注释容器:背景色、左侧 */
54+
.custom-block.info {
55+
background-color: var(--vp-custom-block-info-bg);
56+
border-left: 5px solid var(--vp-custom-block-info);
57+
}
58+
59+
/* 提示容器:边框色、背景色、左侧 */
60+
.custom-block.tip {
61+
/* border-color: var(--vp-custom-block-tip); */
62+
background-color: var(--vp-custom-block-tip-bg);
63+
border-left: 5px solid var(--vp-custom-block-tip);
64+
}
65+
66+
/* 警告容器:背景色、左侧 */
67+
.custom-block.warning {
68+
background-color: var(--vp-custom-block-warning-bg);
69+
border-left: 5px solid var(--vp-custom-block-warning);
70+
}
71+
72+
/* 危险容器:背景色、左侧 */
73+
.custom-block.danger {
74+
background-color: var(--vp-custom-block-danger-bg);
75+
border-left: 5px solid var(--vp-custom-block-danger);
76+
}
77+
78+
/* NOTE容器:背景色、左侧 */
79+
.custom-block.note {
80+
background-color: var(--vp-custom-block-note-bg);
81+
border-left: 5px solid var(--vp-custom-block-note);
82+
}
83+
84+
/* IMPORTANT容器:背景色、左侧 */
85+
.custom-block.important {
86+
background-color: var(--vp-custom-block-important-bg);
87+
border-left: 5px solid var(--vp-custom-block-important);
88+
}
89+
90+
/* CAUTION容器:背景色、左侧 */
91+
.custom-block.caution {
92+
background-color: var(--vp-c-red-soft);
93+
border-left: 5px solid var(--vp-c-red-3);
94+
}
95+
96+
@media (min-width: 768px) {
97+
.VPPage .VPTeamPage {
98+
margin: 0 0 5vh 0;
2499
}
25-
26-
.dark {
27-
--vp-custom-block-info: #cccccc;
28-
--vp-custom-block-info-bg: #474748;
29-
30-
--vp-custom-block-tip: #009400;
31-
--vp-custom-block-tip-bg: #003100;
32-
33-
--vp-custom-block-warning: #e6a700;
34-
--vp-custom-block-warning-bg: #4d3800;
35-
36-
--vp-custom-block-danger: #e13238;
37-
--vp-custom-block-danger-bg: #4b1113;
38-
39-
--vp-custom-block-note: #4cb3d4;
40-
--vp-custom-block-note-bg: #193c47;
41-
42-
--vp-custom-block-important: #a371f7;
43-
--vp-custom-block-important-bg: #230555;
44-
45-
--vp-custom-block-details-bg: #ffffff0d;
100+
}
101+
102+
@media (min-width: 960px) {
103+
.VPPage .VPTeamPageTitle {
104+
padding: 0px 40px 48px;
46105
}
47-
48-
/* 标题字体大小 */
49-
.custom-block-title {
50-
font-size: 16px;
106+
}
107+
108+
@media (min-width: 768px) {
109+
.VPPage .lead{
110+
max-width: 740px;
111+
letter-spacing: 0.1px;
112+
line-height: 28px;
113+
font-size: 20px;
51114
}
52-
53-
/* 注释容器:背景色、左侧 */
54-
.custom-block.info {
55-
background-color: var(--vp-custom-block-info-bg);
56-
border-left: 5px solid var(--vp-custom-block-info);
57-
}
58-
59-
/* 提示容器:边框色、背景色、左侧 */
60-
.custom-block.tip {
61-
/* border-color: var(--vp-custom-block-tip); */
62-
background-color: var(--vp-custom-block-tip-bg);
63-
border-left: 5px solid var(--vp-custom-block-tip);
64-
}
65-
66-
/* 警告容器:背景色、左侧 */
67-
.custom-block.warning {
68-
background-color: var(--vp-custom-block-warning-bg);
69-
border-left: 5px solid var(--vp-custom-block-warning);
70-
}
71-
72-
/* 危险容器:背景色、左侧 */
73-
.custom-block.danger {
74-
background-color: var(--vp-custom-block-danger-bg);
75-
border-left: 5px solid var(--vp-custom-block-danger);
76-
}
77-
78-
/* NOTE容器:背景色、左侧 */
79-
.custom-block.note {
80-
background-color: var(--vp-custom-block-note-bg);
81-
border-left: 5px solid var(--vp-custom-block-note);
82-
}
83-
84-
/* IMPORTANT容器:背景色、左侧 */
85-
.custom-block.important {
86-
background-color: var(--vp-custom-block-important-bg);
87-
border-left: 5px solid var(--vp-custom-block-important);
88-
}
89-
90-
/* CAUTION容器:背景色、左侧 */
91-
.custom-block.caution {
92-
background-color: var(--vp-c-red-soft);
93-
border-left: 5px solid var(--vp-c-red-3);
94-
}
115+
}

‎docs/team.md‎

Lines changed: 0 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -121,30 +121,6 @@ const contributors = [
121121
]
122122
</script>
123123

124-
<style>
125-
126-
@media (min-width: 768px) {
127-
.VPTeamPage[data-v-5f7da39d] {
128-
margin: 0 0;
129-
}
130-
}
131-
132-
@media (min-width: 960px) {
133-
.VPTeamPageTitle[data-v-baf690b4] {
134-
padding: 0px 40px 48px;
135-
}
136-
}
137-
138-
@media (min-width: 768px) {
139-
.lead[data-v-baf690b4] {
140-
max-width: 740px;
141-
letter-spacing: 0.1px;
142-
line-height: 28px;
143-
font-size: 20px;
144-
}
145-
}
146-
</style>
147-
148124
<VPTeamPage>
149125
<VPTeamPageSection>
150126
<template #title>组织</template>

0 commit comments

Comments
 (0)