mirror of
https://github.com/anomalyco/opencode.git
synced 2026-07-23 10:45:33 -04:00
687dbba6a3
Co-authored-by: opencode-agent[bot] <opencode-agent[bot]@users.noreply.github.com> Co-authored-by: James Long <longster@gmail.com> Co-authored-by: Aiden Cline <63023139+rekram1-node@users.noreply.github.com> Co-authored-by: Dustin Deus <deusdustin@gmail.com> Co-authored-by: starptech <starptech@starptechs-MBP.fritz.box> Co-authored-by: Frank <frank@anoma.ly> Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com> Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com> Co-authored-by: 𝓛𝓲𝓽𝓽𝓵𝓮 𝓕𝓻𝓪𝓷𝓴 <little-frank@opencord.local> Co-authored-by: Aiden Cline <aidenpcline@gmail.com> Co-authored-by: Dax <mail@thdxr.com> Co-authored-by: usrnk1 <7547651+usrnk1@users.noreply.github.com> Co-authored-by: Jay <53023+jayair@users.noreply.github.com> Co-authored-by: Brendan Allan <git@brendonovich.dev> Co-authored-by: Brendan Allan <14191578+Brendonovich@users.noreply.github.com> Co-authored-by: runvip <164729189+runvip@users.noreply.github.com> Co-authored-by: Shoubhit Dash <shoubhit2005@gmail.com> Co-authored-by: Jack <jack@anoma.ly> Co-authored-by: opencode <opencode@sst.dev> Co-authored-by: Aarav Sareen <96787824+arvsrn@users.noreply.github.com> Co-authored-by: Julian Coy <julian@ex-machina.co> Co-authored-by: Vladimir Glafirov <vglafirov@gitlab.com> Co-authored-by: Adam <2363879+adamdotdevin@users.noreply.github.com> Co-authored-by: Kit Langton <kit.langton@gmail.com> Co-authored-by: Simon Klee <hello@simonklee.dk> Co-authored-by: Jay <air@live.ca> Co-authored-by: David Hill <1879069+iamdavidhill@users.noreply.github.com> Co-authored-by: James Long <jlongster@users.noreply.github.com> Co-authored-by: 冯基魁 <56265583+fengjikui@users.noreply.github.com> Co-authored-by: Aiden Cline <rekram1-node@users.noreply.github.com>
331 lines
11 KiB
CSS
331 lines
11 KiB
CSS
@import "@opencode-ai/ui/styles/tailwind";
|
|
@import "@opencode-ai/session-ui/styles";
|
|
@import "@opencode-ai/ui/v2/styles/tailwind.css";
|
|
@import "tw-animate-css";
|
|
|
|
@font-face {
|
|
font-family: "JetBrainsMono Nerd Font Mono";
|
|
src: url("/assets/JetBrainsMonoNerdFontMono-Regular.woff2") format("woff2");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Inter";
|
|
src: url("/assets/Inter.ttf") format("truetype");
|
|
font-weight: 100 900;
|
|
font-style: normal;
|
|
}
|
|
|
|
@media (display-mode: standalone) {
|
|
/* WebKit excludes safe-area insets from dvh in installed apps. */
|
|
#root {
|
|
height: 100vh;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
[data-component="getting-started"] {
|
|
container-type: inline-size;
|
|
container-name: getting-started;
|
|
}
|
|
|
|
[data-component="dropdown-menu-content"].desktop-app-menu,
|
|
[data-component="dropdown-menu-sub-content"].desktop-app-menu {
|
|
min-width: 160px;
|
|
padding: 2px;
|
|
}
|
|
|
|
[data-component="dropdown-menu-content"].desktop-app-menu {
|
|
width: 160px;
|
|
}
|
|
|
|
[data-component="dropdown-menu-sub-content"].desktop-app-menu {
|
|
width: max-content;
|
|
min-width: 240px;
|
|
max-width: min(320px, calc(100vw - 24px));
|
|
}
|
|
|
|
[data-component="dropdown-menu-content"].desktop-app-menu [data-slot="dropdown-menu-group-label"] {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 28px;
|
|
padding: 0 12px;
|
|
font-size: var(--font-size-x-small);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1;
|
|
color: var(--text-weak);
|
|
}
|
|
|
|
[data-component="dropdown-menu-content"].desktop-app-menu [data-slot="dropdown-menu-item"],
|
|
[data-component="dropdown-menu-content"].desktop-app-menu [data-slot="dropdown-menu-sub-trigger"],
|
|
[data-component="dropdown-menu-sub-content"].desktop-app-menu [data-slot="dropdown-menu-item"],
|
|
[data-component="dropdown-menu-sub-content"].desktop-app-menu [data-slot="dropdown-menu-sub-trigger"] {
|
|
min-height: 28px;
|
|
padding: 0 12px;
|
|
gap: 8px;
|
|
font-weight: var(--font-weight-regular);
|
|
line-height: 1;
|
|
}
|
|
|
|
[data-component="dropdown-menu-content"].desktop-app-menu [data-slot="dropdown-menu-item-label"],
|
|
[data-component="dropdown-menu-sub-content"].desktop-app-menu [data-slot="dropdown-menu-item-label"] {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
[data-slot="desktop-app-menu-keybind"] {
|
|
margin-left: auto;
|
|
color: var(--text-weak);
|
|
font-size: var(--font-size-x-small);
|
|
font-weight: var(--font-weight-regular);
|
|
white-space: nowrap;
|
|
}
|
|
|
|
[data-slot="desktop-app-menu-chevron"] {
|
|
display: flex;
|
|
margin-left: auto;
|
|
color: var(--icon-base);
|
|
}
|
|
|
|
[data-component="getting-started-actions"] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.75rem; /* gap-3 */
|
|
}
|
|
|
|
[data-component="getting-started-actions"] > [data-component="button"] {
|
|
width: 100%;
|
|
}
|
|
|
|
@container getting-started (min-width: 17rem) {
|
|
[data-component="getting-started-actions"] {
|
|
flex-direction: row;
|
|
align-items: center;
|
|
}
|
|
|
|
[data-component="getting-started-actions"] > [data-component="button"] {
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
.home-session-group-header::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: -12px;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 12px;
|
|
background: var(--v2-background-bg-base);
|
|
}
|
|
|
|
.home-session-group-header::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 16px;
|
|
pointer-events: none;
|
|
background: linear-gradient(
|
|
180deg,
|
|
var(--v2-background-bg-base) 0%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 92.0456%, transparent) 7.93%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 84.9947%, transparent) 14.14%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 78.6813%, transparent) 19%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 72.9394%, transparent) 22.85%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 67.6028%, transparent) 26.05%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 62.5055%, transparent) 28.95%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 57.4815%, transparent) 31.91%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 52.3647%, transparent) 35.27%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 46.989%, transparent) 39.4%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 41.1884%, transparent) 44.65%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 34.7969%, transparent) 51.36%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 27.6484%, transparent) 59.9%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 19.5767%, transparent) 70.62%,
|
|
color-mix(in srgb, var(--v2-background-bg-base) 10.416%, transparent) 83.87%,
|
|
transparent 100%
|
|
);
|
|
}
|
|
|
|
[data-slot="titlebar-update-loader"] {
|
|
display: block;
|
|
flex-shrink: 0;
|
|
margin: 1px;
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 9999px;
|
|
border: 2px solid color-mix(in srgb, var(--v2-icon-icon-accent) 30%, transparent);
|
|
border-top-color: var(--v2-icon-icon-accent);
|
|
animation: titlebar-update-loader-spin 0.67s linear infinite;
|
|
transform-origin: 50% 50%;
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
[data-slot="titlebar-update-loader"] {
|
|
animation: none;
|
|
}
|
|
}
|
|
|
|
@keyframes titlebar-update-loader-spin {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
@keyframes home-projects-fade-top {
|
|
from {
|
|
visibility: hidden;
|
|
}
|
|
to {
|
|
visibility: visible;
|
|
}
|
|
}
|
|
|
|
@keyframes home-projects-fade-bottom {
|
|
from {
|
|
visibility: visible;
|
|
}
|
|
to {
|
|
visibility: hidden;
|
|
}
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"] {
|
|
timeline-scope: --home-projects-scroll;
|
|
}
|
|
|
|
[data-slot="model-selector-scroll"] {
|
|
timeline-scope: --model-selector-scroll;
|
|
}
|
|
|
|
[data-slot="manage-models-scroll"] {
|
|
timeline-scope: --manage-models-scroll;
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"]::before,
|
|
[data-slot="home-projects-scroll"]::after,
|
|
[data-slot="model-selector-scroll"]::before,
|
|
[data-slot="model-selector-scroll"]::after,
|
|
[data-slot="manage-models-scroll"]::before {
|
|
content: "";
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 10;
|
|
height: 16px;
|
|
pointer-events: none;
|
|
visibility: hidden;
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"]::before {
|
|
top: 0;
|
|
background: linear-gradient(to bottom, var(--v2-background-bg-base), transparent);
|
|
}
|
|
|
|
[data-slot="model-selector-scroll"]::before {
|
|
top: 0;
|
|
height: 12px;
|
|
background: linear-gradient(
|
|
180deg,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 80%, transparent) 0%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 78.3336%, transparent) 4.7%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 76.4824%, transparent) 8.9%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 74.368%, transparent) 12.8%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 71.9123%, transparent) 16.56%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 69.037%, transparent) 20.37%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 65.664%, transparent) 24.4%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 61.715%, transparent) 28.83%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 57.1117%, transparent) 33.84%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 51.776%, transparent) 39.6%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 45.6296%, transparent) 46.3%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 38.5944%, transparent) 54.1%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 30.592%, transparent) 63.2%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 21.5443%, transparent) 73.76%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 11.373%, transparent) 85.97%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 0%, transparent) 100%
|
|
);
|
|
}
|
|
|
|
[data-slot="manage-models-scroll"]::before {
|
|
top: 0;
|
|
background: linear-gradient(to bottom, var(--v2-background-bg-base), transparent);
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"]::after {
|
|
bottom: 0;
|
|
background: linear-gradient(to top, var(--v2-background-bg-base), transparent);
|
|
}
|
|
|
|
[data-slot="model-selector-scroll"]::after {
|
|
bottom: 0;
|
|
height: 12px;
|
|
background: linear-gradient(
|
|
0deg,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 80%, transparent) 0%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 78.3336%, transparent) 4.7%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 76.4824%, transparent) 8.9%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 74.368%, transparent) 12.8%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 71.9123%, transparent) 16.56%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 69.037%, transparent) 20.37%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 65.664%, transparent) 24.4%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 61.715%, transparent) 28.83%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 57.1117%, transparent) 33.84%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 51.776%, transparent) 39.6%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 45.6296%, transparent) 46.3%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 38.5944%, transparent) 54.1%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 30.592%, transparent) 63.2%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 21.5443%, transparent) 73.76%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 11.373%, transparent) 85.97%,
|
|
color-mix(in srgb, var(--v2-background-bg-layer-01) 0%, transparent) 100%
|
|
);
|
|
}
|
|
|
|
@supports (animation-timeline: --home-projects-scroll) and (timeline-scope: --home-projects-scroll) {
|
|
[data-slot="home-projects-scroll"] .scroll-view__viewport {
|
|
scroll-timeline: --home-projects-scroll y;
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"]::before {
|
|
animation: home-projects-fade-top linear both;
|
|
animation-timeline: --home-projects-scroll;
|
|
animation-range: 0 0.1px;
|
|
}
|
|
|
|
[data-slot="home-projects-scroll"]::after {
|
|
animation: home-projects-fade-bottom linear both;
|
|
animation-timeline: --home-projects-scroll;
|
|
animation-range: calc(100% - 1.1px) calc(100% - 1px);
|
|
}
|
|
}
|
|
|
|
@supports (animation-timeline: --model-selector-scroll) and (timeline-scope: --model-selector-scroll) {
|
|
[data-slot="model-selector-scroll"] .scroll-view__viewport {
|
|
scroll-timeline: --model-selector-scroll y;
|
|
}
|
|
|
|
[data-slot="model-selector-scroll"]::before {
|
|
animation: home-projects-fade-top linear both;
|
|
animation-timeline: --model-selector-scroll;
|
|
animation-range: 0 0.1px;
|
|
}
|
|
|
|
[data-slot="model-selector-scroll"]::after {
|
|
animation: home-projects-fade-bottom linear both;
|
|
animation-timeline: --model-selector-scroll;
|
|
animation-range: calc(100% - 1.1px) calc(100% - 1px);
|
|
}
|
|
}
|
|
|
|
@supports (animation-timeline: --manage-models-scroll) and (timeline-scope: --manage-models-scroll) {
|
|
[data-slot="manage-models-scroll"] .settings-v2-panel {
|
|
scroll-timeline: --manage-models-scroll y;
|
|
}
|
|
|
|
[data-slot="manage-models-scroll"]::before {
|
|
animation: home-projects-fade-top linear both;
|
|
animation-timeline: --manage-models-scroll;
|
|
animation-range: 0 0.1px;
|
|
}
|
|
}
|
|
}
|