Something went wrong. Try again.
opencode v2 mirror
Something went wrong. Try again.
CSS
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124@keyframes composer-attachments-fade-left { from { visibility: hidden; } to { visibility: visible; }}
@keyframes composer-attachments-fade-right { from { visibility: visible; } to { visibility: hidden; }}
[data-component="upload-row"] { display: flex; flex-direction: column; gap: 4px;
& + & { margin-top: 8px; }
[data-slot="upload-row-label"] { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: 13px; line-height: var(--line-height-base); letter-spacing: -0.04px; }
[data-slot="upload-row-name"] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--v2-text-text-base); font-weight: 530; }
[data-slot="upload-row-percent"] { flex-shrink: 0; color: var(--v2-text-text-muted); font-variant-numeric: tabular-nums; }
[data-slot="upload-row-track"] { display: flex; align-items: center; gap: 8px; }
[data-component="upload-progress"] { flex: 1; height: 4px; overflow: hidden; border-radius: 999px; background: var(--v2-background-bg-layer-02); }
[data-slot="upload-progress-bar"] { height: 100%; border-radius: inherit; background: var(--v2-icon-icon-base); transition: width 160ms ease-out; }
[data-slot="upload-row-cancel"] { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--v2-icon-icon-muted); cursor: pointer;
&:hover { background: var(--v2-overlay-simple-overlay-hover); color: var(--v2-icon-icon-base); }
svg { width: 12px; height: 12px; } }}
[data-component="composer-attachments"] { timeline-scope: --composer-attachments-scroll;
[data-slot^="composer-attachments-fade-"] { visibility: hidden; }}
@supports (animation-timeline: --composer-attachments-scroll) and (timeline-scope: --composer-attachments-scroll) { [data-component="composer-attachments"] [data-slot="composer-attachments-scroll"] { scroll-timeline: --composer-attachments-scroll x; }
[data-component="composer-attachments"] [data-slot="composer-attachments-fade-left"] { animation: composer-attachments-fade-left linear both; animation-timeline: --composer-attachments-scroll; animation-range: 0 0.1px; }
[data-component="composer-attachments"] [data-slot="composer-attachments-fade-right"] { animation: composer-attachments-fade-right linear both; animation-timeline: --composer-attachments-scroll; animation-range: calc(100% - 1.1px) calc(100% - 1px); }}