File name
Commit message
Commit date
File name
Commit message
Commit date
09-04
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
09-04
File name
Commit message
Commit date
@use "@fox/styles/abstracts" as fox;
// 트리 한 줄 — 깊이만큼 들여쓰고 캐럿·아이콘·이름이 차례로 선다.
.name {
display: flex;
align-items: center;
gap: fox.gap(2);
}
.toggle {
display: inline-flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
inline-size: fox.icon(4);
font-size: fox.icon(4);
block-size: fox.icon(4);
border: none;
background: none;
color: fox.color(icon-neutral-default);
cursor: pointer;
> svg {
inline-size: fox.icon(3);
font-size: fox.icon(3);
block-size: fox.icon(3);
}
&:focus-visible {
outline: fox.border(2) solid fox.color(border-theme-primary);
outline-offset: fox.border(1);
}
}
// 자식이 없는 줄도 자리를 잡아 이름 시작 위치가 흔들리지 않게 한다.
.togglePlaceholder {
display: inline-block;
flex-shrink: 0;
inline-size: fox.icon(4);
}
.icon {
display: inline-flex;
flex-shrink: 0;
color: fox.color(icon-neutral-subtle);
> svg {
inline-size: fox.icon(3);
font-size: fox.icon(3);
block-size: fox.icon(3);
}
}