style: 优化系列导航栏的样式与折叠箭头,使其与 admonition 保持一致
continuous-integration/drone/push Build is passing

This commit is contained in:
seahi committed 2026-08-17 12:24:28 +08:00
1 parent 37b8ffc7fe
commit 6a74daa91d
1 file changed
+19 -29
+19 -29
View File
@@ -139,21 +139,6 @@
<a href={resolve('/series/[slug]', { slug: data.series.slug })}>{data.series.name}</a <a href={resolve('/series/[slug]', { slug: data.series.slug })}>{data.series.name}</a
></span ></span
> >
<span class="details-icon">
<svg
aria-hidden="true"
focusable="false"
role="img"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 256 512"
width="12"
height="12"
><path
fill="currentColor"
d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
></path></svg
>
</span>
</div> </div>
<div bind:this={seriesContentEl} class="details-content series-content"> <div bind:this={seriesContentEl} class="details-content series-content">
<nav> <nav>
@@ -237,33 +222,38 @@
margin: 0.8rem 0; margin: 0.8rem 0;
} }
/* .series-title — 高度对齐 admonition-title */ /* .series-title — 高度、字号及箭头与 admonition-title 完全一致 */
.series-nav .series-title { .series-nav .series-title {
position: relative;
font-size: 1rem; font-size: 1rem;
font-weight: bold; font-weight: bold;
display: flex; display: flex;
justify-content: space-between;
align-items: center; align-items: center;
line-height: 1.6; line-height: 1.6;
padding: 0.25rem 0.75rem; padding: 0.25rem 2rem 0.25rem 0.75rem;
background: #e6e6e6; background: #e6e6e6;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
} }
/* .details-icon — 对应 DoIt .details .details-icon > svg */ /* 展开收缩箭头 — 与 admonition 完全一致 */
.series-nav .details-icon { .series-nav .series-title::after {
display: flex; content: '';
align-items: center; position: absolute;
color: #4d4d4d; right: 0.75rem;
top: 0.85rem;
width: 0.4rem;
height: 0.4rem;
border-right: 2px solid currentColor;
border-bottom: 2px solid currentColor;
transform: rotate(-45deg);
transition: transform 0.2s ease-in-out;
opacity: 0.6;
} }
.series-nav .details-icon > :global(svg) { .series-nav.open .series-title::after {
transition: transform 0.2s ease; transform: rotate(45deg);
} top: 0.7rem;
.series-nav.open .details-icon > :global(svg) {
transform: rotate(90deg);
} }
/* .series-content — 展开收缩动画,与 admonition 完全一致 */ /* .series-content — 展开收缩动画,与 admonition 完全一致 */