huangjiafeng/yk-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style：功能卡片布局优化

Browse Source
This commit is contained in:
Jafeng 2026-05-09 16:17:03 +08:00
parent 9c31e54df1
commit e19ba19dee
4 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/assets/国家呼吸医学中心.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
public/assets/国家骨科医学中心.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

4
src/data/homepage.js
View File

@ -59,8 +59,8 @@ export const solutions = [
export const caseCategories = ['国家医学中心', '公立医院', '妇幼保健客户', '医疗集团客户']
export const cases = [
{ logo: '/assets/上海六院.png', logoFit: 'round', name: '国家骨科医学中心\n上海市第六人民医院', category: '国家医学中心' },
{ logo: '/assets/国家呼吸中心.gif', logoFit: 'wide', name: '国家呼吸医学中心\n广州医科大学附属第一医院', category: '国家医学中心' },
{ logo: '/assets/国家骨科医学中心.webp ', logoFit: 'round', name: '国家骨科医学中心', category: '国家医学中心' },
{ logo: '/assets/国家呼吸医学中心.png', logoFit: 'wide', name: '国家呼吸医学中心', category: '国家医学中心' },
{ logo: '/assets/广附一.jpg', logoFit: 'round', name: '广州医科大学附属第一医院', category: '公立医院' },
{ logo: '/assets/上海六院.png', logoFit: 'round', name: '上海市第六人民医院', category: '公立医院' },
{ logo: '/assets/广医口腔logo.png', logoFit: 'round', name: '广州医科大学附属口腔医院', category: '公立医院' },

36
src/styles/theme.css
View File

@ -423,7 +423,7 @@ button {
.feature-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 28px;
gap: 20px;
}
.feature-card {
@ -444,10 +444,11 @@ button {
.feature-head {
position: relative;
display: grid;
place-items: center;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 28px 20px 24px;
padding: 18px 18px;
color: #fff;
background: linear-gradient(180deg, var(--brand), #ff7900);
}
@ -456,7 +457,7 @@ button {
content: "";
position: absolute;
inset: auto -18px -22px -18px;
height: 48px;
height: 34px;
border-radius: 50% 50% 0 0;
background: #fff;
opacity: 0.12;
@ -465,8 +466,9 @@ button {
.feature-icon {
position: relative;
z-index: 1;
width: 72px;
height: 72px;
flex: 0 0 48px;
width: 48px;
height: 48px;
border-radius: 999px;
display: grid;
place-items: center;
@ -474,32 +476,38 @@ button {
background: #fff;
}
.feature-icon .icon-mark {
width: 28px;
height: 28px;
}
.feature-head h3 {
position: relative;
z-index: 1;
margin: 0;
font-size: 21px;
font-size: 18px;
line-height: 1.25;
}
.feature-list {
list-style: none;
display: grid;
gap: 12px;
gap: 9px;
margin: 0;
padding: 22px 18px 24px;
padding: 16px;
background: linear-gradient(180deg, #fff, #fffaf5);
}
.feature-list li {
display: flex;
align-items: center;
gap: 9px;
min-height: 36px;
padding: 8px 12px;
gap: 8px;
min-height: 32px;
padding: 7px 10px;
border-radius: 6px;
background: #fff7ec;
color: #535b68;
font-size: 14px;
font-size: 13px;
border: 1px solid rgba(255, 138, 0, 0.12);
}