yiqiu/BlackFruit-UI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

幅度萨芬
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
yiqiu
2025-11-22 18:31:57 +08:00
parent a18136def5
commit 0b3f5ca820
1 changed files with 141 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

216
css/index.css
View File

@@ -183,13 +183,28 @@ body#index .nav-right .control {
color: #E5E7EB;
}
/* 服务内容 */
.service-content {
display: flex;
margin-top: 60px;
margin: -10px;
margin-top: 50px;
}
/* 服务内容 */
.service-content {
display: flex;
margin-top: 60px;
margin: -10px;
margin-top: 50px;
}
/* 服务模块整体背景：与首页 banner 保持暗色科技感基调 */
.section.service {
background:
radial-gradient(circle at 10% 0%, rgba(56, 189, 248, 0.18) 0%, transparent 40%),
linear-gradient(180deg, #020617 0%, #020617 100%);
}
.section.service .section-title h2 {
color: #F9FAFB;
}
.section.service .section-title .section-desc {
color: rgba(148, 163, 184, 0.95);
}
.service .service-box {
min-height: 191px;
@@ -253,11 +268,11 @@ body#index .nav-right .control {
}
/* 解决方案 */
.resolve {
background: #13182C url(../assets/img/index/home-bg.png) no-repeat center center;
background-size: cover;
}
/* 解决方案 */
.resolve {
background: #13182C url(../assets/img/index/home-bg.png) no-repeat center center;
background-size: cover;
}
.resolve-content {
margin: -10px;
@@ -337,8 +352,19 @@ body#index .nav-right .control {
/* 服务实践 */
.practice {}
/* 服务实践 */
.practice {
/* 与解决方案区域衔接的暗色背景 */
background: linear-gradient(180deg, #020617 0%, #020617 100%);
}
.practice .section-title h2 {
color: #F9FAFB;
}
.practice .section-title .section-desc {
color: rgba(148, 163, 184, 0.95);
}
.practice .practice-content {
margin: -10px;
@@ -392,10 +418,13 @@ body#index .nav-right .control {
box-shadow: 0px 0px 16px rgba(52, 52, 52, 0.16);
}
/* 基础措施 */
.section-base {
background: rgba(247, 248, 250, 1);
}
/* 基础措施 */
.section-base {
/* 统一为暗色科技风背景，下方 cert 卡片及地图以亮色卡片形式凸显 */
background:
radial-gradient(circle at 0% 0%, rgba(56, 189, 248, 0.18) 0%, transparent 40%),
linear-gradient(180deg, #020617 0%, #020617 100%);
}
.section-base .base {
margin-top: 42px;
@@ -405,20 +434,33 @@ body#index .nav-right .control {
padding: 62px 20px 0;
}
.section-base .base img {
width: calc(100% - 140px);
margin-left: 35px;
height: 520px;
padding-right: 80px;
}
.section-base .base img {
width: calc(100% - 140px);
margin-left: 35px;
height: 520px;
padding-right: 80px;
}
.base .base-content {
margin-bottom: 100px;
}
.base .base-content .title-desc {
white-space: nowrap;
}
.base .base-content {
margin-bottom: 100px;
}
.base .base-content .title-desc {
white-space: nowrap;
color: rgba(148, 163, 184, 0.95);
}
.section-base .section-title h2 {
color: #F9FAFB;
}
.section-base .section-title .section-desc {
color: rgba(148, 163, 184, 0.95);
}
.section-base .base-content h2 {
color: #F9FAFB;
}
.cert {
border: 2px solid #FFFFFF;
@@ -450,32 +492,48 @@ body#index .nav-right .control {
margin-top: 5px;
}
/* 新闻 */
.news-content {
margin-top: 60px;
display: flex;
flex-wrap: wrap;
gap: 130px;
}
/* 新闻 */
.section.news {
background: linear-gradient(180deg, #020617 0%, #020617 100%);
}
.section.news .section-title h2 {
color: #F9FAFB;
}
.section.news .section-title .section-desc {
color: rgba(148, 163, 184, 0.95);
}
.news-content {
margin-top: 60px;
display: flex;
flex-wrap: wrap;
gap: 130px;
}
.news-content .news-cont {
flex: 1;
}
.news-content .news-cont {
flex: 1;
/* 新闻列表块采用深色卡片，与整体暗色背景协调 */
background: rgba(15, 23, 42, 0.92);
border-radius: 16px;
padding: 24px 24px 16px;
box-shadow: 0 20px 45px rgba(15, 23, 42, 0.7);
border: 1px solid rgba(148, 163, 184, 0.4);
}
.news-content .news-head .news-title {
padding-left: 5px;
font-size: 22px;
}
.news-content .news-head .news-title {
padding-left: 5px;
font-size: 22px;
}
.news-content .news-head .news-title {
position: relative;
padding-left: 10px;
font-size: 18px;
line-height: 20px;
height: 20px;
}
padding-left: 10px;
font-size: 18px;
line-height: 20px;
height: 20px;
}
.news-content .news-head .news-title::before {
content: '';
@@ -485,13 +543,21 @@ body#index .nav-right .control {
left: 0;
top: 0;
background: #38BDF8;
}
.news-content .news-head .news-more {
font-size: 14px;
color: rgba(0, 0, 0, 0.6);
}
}
.news-content .news-head .news-more {
font-size: 14px;
color: rgba(148, 163, 184, 0.9);
}
.news-content .news-head .news-more a {
color: inherit;
}
.news-content .news-head .news-more a:hover {
color: #E5E7EB;
}
.news-content .news-list {
margin-top: 15px;
@@ -516,30 +582,30 @@ body#index .nav-right .control {
background: rgba(56, 189, 248, 1);
}
.news-content .news-item .number {
margin-right: 10px;
display: flex;
align-items: center;
.news-content .news-item .number {
margin-right: 10px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 12px;
width: 14px;
height: 14px;
background: rgba(222, 222, 222, 1);
border-radius: 3px;
}
.news-content .news-item .title {
font-size: 14px;
color: rgba(0, 0, 0, 0.90);
}
background: rgba(222, 222, 222, 1);
border-radius: 3px;
}
.news-content .news-item .title {
font-size: 14px;
color: #E5E7EB;
}
.news-content .news-item .title:hover {
color: rgba(56, 189, 248, 1);
}
.news-content .news-item .time {
color: rgba(0, 0, 0, 0.4);
}
.news-content .news-item .time {
color: rgba(148, 163, 184, 0.9);
font-size: 13px;
min-width: 100px;
text-align: right;