Something went wrong. Try again.
opencode v2 mirror
Something went wrong. Try again.
3.3 kB · 154 lines
CSS
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155[data-component="collapsible"] { width: 100%; display: flex; flex-direction: column; background-color: transparent; border: none; transition: background-color 0.15s ease; border-radius: var(--radius-md); overflow: visible;
&.tool-collapsible { --tool-content-gap: 4px; gap: var(--tool-content-gap); }
[data-slot="collapsible-trigger"] { width: 100%; display: flex; height: 32px; padding: 0; align-items: center; align-self: stretch; cursor: default; user-select: none; color: var(--text-base);
[data-slot="collapsible-arrow"] { opacity: 0; transition: opacity 0.15s ease; will-change: opacity; transform: translateZ(0); }
[data-slot="collapsible-arrow-icon"] { display: inline-flex; color: var(--icon-weaker); transform: translateZ(0) rotate(-90deg); transition: transform 0.15s ease; will-change: transform; }
&:hover [data-slot="collapsible-arrow"] { opacity: 1; }
/* text-12-medium */ font-family: var(--font-family-sans); font-size: var(--font-size-small); font-style: normal; font-weight: var(--font-weight-medium); line-height: var(--line-height-large); /* 166.667% */ letter-spacing: var(--letter-spacing-normal);
/* &:hover { */ /* background-color: var(--surface-base); */ /* } */ &:focus-visible { outline: none; background-color: var(--surface-raised-base-hover); } &[data-disabled] { cursor: not-allowed; }
&[data-hide-details="true"] { height: auto; align-items: stretch; }
[data-slot="collapsible-arrow"] { flex-shrink: 0; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; } }
[data-slot="collapsible-trigger"][aria-expanded="true"] { [data-slot="collapsible-arrow"] { opacity: 1; }
[data-slot="collapsible-arrow-icon"] { transform: translateZ(0) rotate(0deg); } }
[data-slot="collapsible-content"] { overflow: hidden; /* animation: slideUp 250ms ease-out; */
&[data-expanded] { overflow: visible; }
/* &[data-expanded] { */ /* animation: slideDown 250ms ease-out; */ /* } */ }
&[data-variant="ghost"] { background-color: transparent; border: none;
> [data-slot="collapsible-trigger"] { background-color: transparent; border: none; padding: 0;
/* &:hover { */ /* color: var(--text-strong); */ /* } */ &:focus-visible { outline: none; background-color: var(--surface-raised-base-hover); } &[data-disabled] { cursor: not-allowed; } } }
&[data-variant="ghost"][data-scope="filetree"] { > [data-slot="collapsible-trigger"] { height: 24px; } }
&[data-variant="ghost"][data-scope="file-tree-v2"] { > [data-slot="collapsible-trigger"] { height: 28px; } }}
@keyframes slideDown { from { height: 0; } to { height: var(--kb-collapsible-content-height); }}
@keyframes slideUp { from { height: var(--kb-collapsible-content-height); } to { height: 0; }}