diff options
| author | David Hill <[email protected]> | 2026-01-20 18:02:13 +0000 |
|---|---|---|
| committer | David Hill <[email protected]> | 2026-01-20 20:34:45 +0000 |
| commit | 39afc055bf777d8eeeee2fa747e1d29b90cfe567 (patch) | |
| tree | 47486f952fba066a48beb16fbb779d6ec59012b8 | |
| parent | 73b1bc42f485d7097cd5cbd8ec6cca933319b435 (diff) | |
| download | opencode-39afc055bf777d8eeeee2fa747e1d29b90cfe567.tar.gz opencode-39afc055bf777d8eeeee2fa747e1d29b90cfe567.zip | |
add fade gradient to settings panel headers
| -rw-r--r-- | packages/app/src/components/settings-general.tsx | 8 | ||||
| -rw-r--r-- | packages/app/src/components/settings-keybinds.tsx | 8 | ||||
| -rw-r--r-- | packages/app/src/components/settings-permissions.tsx | 8 |
3 files changed, 21 insertions, 3 deletions
diff --git a/packages/app/src/components/settings-general.tsx b/packages/app/src/components/settings-general.tsx index f8ffb421d..dc0652e60 100644 --- a/packages/app/src/components/settings-general.tsx +++ b/packages/app/src/components/settings-general.tsx @@ -37,7 +37,13 @@ export const SettingsGeneral: Component = () => { return ( <div class="flex flex-col h-full overflow-y-auto no-scrollbar"> - <div class="sticky top-0 z-10"> + <div + class="sticky top-0 z-10" + style={{ + background: + "linear-gradient(to bottom, var(--surface-raised-stronger-non-alpha) calc(100% - 24px), transparent)", + }} + > <div class="flex flex-col gap-1 p-8 max-w-[720px]"> <h2 class="text-16-medium text-text-strong">General</h2> </div> diff --git a/packages/app/src/components/settings-keybinds.tsx b/packages/app/src/components/settings-keybinds.tsx index 208bd909e..ca5df993d 100644 --- a/packages/app/src/components/settings-keybinds.tsx +++ b/packages/app/src/components/settings-keybinds.tsx @@ -280,7 +280,13 @@ export const SettingsKeybinds: Component = () => { return ( <div class="flex flex-col h-full overflow-y-auto no-scrollbar"> - <div class="sticky top-0 z-10"> + <div + class="sticky top-0 z-10" + style={{ + background: + "linear-gradient(to bottom, var(--surface-raised-stronger-non-alpha) calc(100% - 24px), transparent)", + }} + > <div class="flex items-start justify-between gap-4 p-8 max-w-[720px]"> <div class="flex flex-col gap-1"> <h2 class="text-16-medium text-text-strong">Keyboard shortcuts</h2> diff --git a/packages/app/src/components/settings-permissions.tsx b/packages/app/src/components/settings-permissions.tsx index b311da0ef..aa83de01e 100644 --- a/packages/app/src/components/settings-permissions.tsx +++ b/packages/app/src/components/settings-permissions.tsx @@ -101,7 +101,13 @@ export const SettingsPermissions: Component = () => { return ( <div class="flex flex-col h-full overflow-y-auto no-scrollbar"> - <div class="sticky top-0 z-10"> + <div + class="sticky top-0 z-10" + style={{ + background: + "linear-gradient(to bottom, var(--surface-raised-stronger-non-alpha) calc(100% - 24px), transparent)", + }} + > <div class="flex flex-col gap-1 p-8 max-w-[720px]"> <h2 class="text-16-medium text-text-strong">Permissions</h2> <p class="text-14-regular text-text-weak">Control what tools the server can use by default.</p> |