style(admin): enhance collapsible summary hover/focus and arrow

This commit is contained in:
萝卜
2026-03-17 19:56:25 +08:00
parent 3e3e183d4d
commit 6c3516e66c

View File

@@ -662,6 +662,42 @@
.collapsible-summary{
user-select:none;
position:relative;
padding-right:32px; /* 预留箭头空间 */
border-radius:var(--adm-radius-sm, 10px);
transition:background .15s ease, box-shadow .15s ease, color .15s ease;
outline:none;
}
/* Ant Design Pro-ishsummary hover/active/focus 交互 */
.collapsible-summary:hover{
background:var(--adm-surface-tint);
}
.collapsible-summary:focus{
box-shadow:0 0 0 3px var(--adm-primary-focus-ring), var(--adm-shadow-sm);
}
/* 右侧箭头(替代原生 marker */
.collapsible-summary::after{
content:"";
position:absolute;
right:14px;
top:50%;
width:8px;
height:8px;
border-right:2px solid var(--adm-text-muted, #94a3b8);
border-bottom:2px solid var(--adm-text-muted, #94a3b8);
transform:translateY(-50%) rotate(45deg);
transition:transform .15s ease, border-color .15s ease;
}
.collapsible-summary:hover::after{
border-color:var(--adm-text-secondary, #64748b);
}
.collapsible[open] > .collapsible-summary::after{
transform:translateY(-50%) rotate(225deg);
}
.collapsible-body{