fix(home): 分轨标题贴左——space-between 把中间项挤到正中
分轨标题行有三个 flex 子项(::before 灰点 + 「阅读/技术」文本 + 右侧
「全部文章 →」),justify-content: space-between 会把中间的标题文本
挤到正中(用户实测"阅读/技术居中了")。改为 flex-start 贴左 + 链接
margin-left:auto 右推。实测标题距容器左缘 18px(灰点+间距),链接贴右。
验证: pnpm astro build 46 页 exit 0;playwright 实测两段标题 titleLeft=18
linkRight=0
Spec: none (单点样式修复)
Co-authored-by: GLM-5.3
This commit is contained in:
1 parent
c4bdf46614
commit
8d221ab36e
1 file changed
+5
-1
@@ -286,6 +286,7 @@ const byMonth = (list: CollectionEntry<'posts'>[]) => {
|
|||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
border-bottom: 1px solid transparent;
|
border-bottom: 1px solid transparent;
|
||||||
}
|
}
|
||||||
|
.more-link { margin-left: auto; }
|
||||||
.more-link:hover { border-bottom-color: var(--accent); }
|
.more-link:hover { border-bottom-color: var(--accent); }
|
||||||
|
|
||||||
/* ---- 首页分轨形态(perTrack):阅读/技朮两段,各段自带更多出口 ---- */
|
/* ---- 首页分轨形态(perTrack):阅读/技朮两段,各段自带更多出口 ---- */
|
||||||
@@ -294,7 +295,10 @@ const byMonth = (list: CollectionEntry<'posts'>[]) => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
gap: 0.35rem;
|
gap: 0.35rem;
|
||||||
justify-content: space-between;
|
/* 不能用 space-between:本行有三个 flex 子项(::before 灰点 + 标题文本 +
|
||||||
|
右侧「全部文章 →」),space-between 会把中间的标题挤到正中(用户实测
|
||||||
|
"阅读/技术居中了")。改为贴左,链接自行右推。 */
|
||||||
|
justify-content: flex-start;
|
||||||
margin: 0 0 var(--space-1);
|
margin: 0 0 var(--space-1);
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|||||||
Reference in new issue
Block a user