refactor(style): 优化首页主要组件样式及布局实现

- 移除 BestSellers 组件中多余的 SCSS 样式,改用 TailwindCSS 工具类规范字体大小和颜色
- 替换 BestSellers.tsx 中对应元素的样式类为 TailwindCSS 实现,提升样式一致性和维护性
- 调整 CatalogShowcase 组件样式,删除不必要的 SCSS 样式,增加内边距并修改书本尺寸,整体优化布局
- CatalogShowcase.tsx 中相关文本和图形元素改为 TailwindCSS 实现,规范字体大小、颜色和间距
- ContactSection 组件部分样式移除过
This commit is contained in:
2026-04-09 13:35:50 +08:00
parent 25abd81d9f
commit 61025522aa
13 changed files with 89 additions and 253 deletions

View File

@@ -40,6 +40,7 @@
justify-content: space-between;
align-items: center;
position: relative;
padding: 16px;
z-index: 1;
}
@@ -51,26 +52,6 @@
padding-right: 16px;
}
&__badge {
font-size: 14px;
font-weight: 700;
color: rgba(255, 255, 255, 0.5);
letter-spacing: 2px;
}
&__title {
font-size: 24px;
font-weight: 700;
color: #ffffff;
margin-bottom: 2px;
}
&__desc {
font-size: 15px;
color: rgba(255, 255, 255, 0.65);
line-height: 1.5;
}
&__cta {
display: inline-flex;
align-items: center;
@@ -84,20 +65,14 @@
border: 1px solid rgba(255, 255, 255, 0.2);
}
&__cta-text {
font-size: 15px;
font-weight: 600;
color: #ffffff;
}
/* ═══ 右侧书本图形 ═══ */
&__right {
flex-shrink: 0;
}
&__book {
width: 72px;
height: 90px;
width: 142px;
height: 180px;
background: rgba(255, 255, 255, 0.12);
border-radius: 4px 10px 10px 4px;
display: flex;
@@ -132,13 +107,4 @@
&:nth-child(2) { height: 40px; }
&:nth-child(3) { height: 32px; }
}
&__book-label {
position: absolute;
bottom: 6px;
right: 8px;
font-size: 14px;
font-weight: 700;
color: rgba(255, 255, 255, 0.4);
}
}