furyhawk/opencode
1
0
Fork 0
mirror of https://github.com/anomalyco/opencode.git synced 2026-07-21 10:16:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(app): refine background contrast

Browse Source
This commit is contained in:
Brendan Allan
2026-07-20 23:43:41 +00:00
parent d881c1c476
commit 5452a13e07
3 changed files with 10 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/app/src/components/prompt-project-selector.tsx
+2
View File
@@ -446,6 +446,7 @@ export function PromptProjectAddButton(props: { controller: PromptProjectControl
return (
<button
data-action="prompt-project"
data-background-surface="project-selector"
type="button"
class="flex h-7 min-w-0 max-w-[160px] items-center gap-1.5 rounded-sm px-2 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint transition-colors hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
onClick={() => props.controller.add()}
@@ -464,6 +465,7 @@ function ProjectTrigger(props: ComponentProps<"button"> & { controller: PromptPr
<button
{...rest}
data-action="prompt-project"
data-background-surface="project-selector"
type="button"
class="flex h-7 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-1.5 transition-colors focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
classList={{
packages/app/src/components/session/session-new-design-view.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ export function NewSessionDesignView(props: { children: JSX.Element }) {
>
<div class="absolute inset-x-0 top-[25.375%] flex justify-center px-6">
<div class={NEW_SESSION_CONTENT_WIDTH}>
<WordmarkV2 class="h-auto w-full text-v2-background-bg-inverse" />
<WordmarkV2 class="h-auto w-full text-v2-background-bg-inverse [&>g>g>g]:!opacity-30" />
<div class="mt-8">{props.children}</div>
</div>
</div>
packages/app/src/index.css
+7 -1
View File
@@ -4,7 +4,7 @@
@import "tw-animate-css";
html[data-background-image] body {
background-image: linear-gradient(rgb(0 0 0 / 12%), rgb(0 0 0 / 12%)), var(--app-background-image);
background-image: linear-gradient(rgb(0 0 0 / 20%), rgb(0 0 0 / 20%)), var(--app-background-image);
background-color: transparent !important;
background-position: center;
background-repeat: no-repeat;
@@ -32,6 +32,12 @@ html[data-background-image] [data-background-surface="prompt"] {
backdrop-filter: blur(16px);
}
html[data-background-image] [data-background-surface="project-selector"] {
background-color: color-mix(in srgb, var(--v2-background-bg-base) 68%, transparent) !important;
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--v2-border-border-base) 70%, transparent);
backdrop-filter: blur(16px);
}
@font-face {
font-family: "JetBrainsMono Nerd Font Mono";
src: url("/assets/JetBrainsMonoNerdFontMono-Regular.woff2") format("woff2");