fix(ui): 块模式展开箭头改用SVG mask,修复偏位和非中心旋转

This commit is contained in:
JOJO 2026-06-11 00:24:56 +08:00
parent 04128fac14
commit f9d194f100

View File

@ -701,17 +701,23 @@ body[data-theme='dark'] .collapsible-header:hover {
width: 16px;
min-width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 16px;
background-color: currentColor;
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M13.5 10L19 16L13.5 22' stroke='%23000' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M13.5 10L19 16L13.5 22' stroke='%23000' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
mask-size: contain;
-webkit-mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-position: center;
-webkit-mask-position: center;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
color: var(--claude-text-secondary);
}
/* 移除旧的 ::before 箭头 */
.arrow::before {
content: '';
font-size: 18px;
content: none;
}
.collapsible-block.expanded .arrow {