commit 575bb725637f1ff85ec23701e7ff05c6ff937bda Author: Brightwav3 Date: Thu Jun 11 23:43:20 2026 +0200 Initial commit of Coding Agent theme with README diff --git a/README.md b/README.md new file mode 100644 index 0000000..f9f6c5b --- /dev/null +++ b/README.md @@ -0,0 +1,12 @@ +# Coding Agent Theme + +An Obsidian theme with multiple identities, switchable in Style Settings: + +- **Claude Code** (default) — warm near-black + Anthropic coral accent +- **OpenAI Codex** — cool neutral black + OpenAI teal-green accent +- **Paper (Courier)** — light mint typewriter look with customizable orange/green accents + +## Installation + +1. Copy this folder into your vault's `.obsidian/themes/` directory. +2. Select **Coding Agent** in Settings -> Appearance -> Theme. diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..446fcb6 --- /dev/null +++ b/manifest.json @@ -0,0 +1,7 @@ +{ + "name": "Coding Agent", + "version": "1.1.0", + "minAppVersion": "1.0.0", + "author": "BrightWav3", + "authorUrl": "" +} diff --git a/theme.css b/theme.css new file mode 100644 index 0000000..0e0a5a6 --- /dev/null +++ b/theme.css @@ -0,0 +1,661 @@ +@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap'); + +/* ========================================================================== + coding agent — Obsidian theme + -------------------------------------------------------------------------- + One theme, two coding-agent identities, switchable in Style Settings: + + • Claude Code (default) — warm near-black + Anthropic coral + • OpenAI Codex — cool neutral black + OpenAI teal-green + + The whole chrome (titlebar, tabs, sidebar, file tree, status bar, + scrollbars) is styled so the app reads as the chosen agent, not just the + note body. Every accent-derived token recomputes from a single --cc-accent, + so swapping looks repaints everything. + ========================================================================== */ + +/* @settings +name: coding agent +id: coding-agent +settings: + - + id: cc-look + title: Look + description: Overall visual identity of the whole app. + type: class-select + allowEmpty: false + default: cc-look-claude + options: + - + label: Claude Code + value: cc-look-claude + - + label: OpenAI Codex + value: cc-look-codex + - + label: Paper (Courier) + value: cc-look-paper + - + id: cc-bg-depth + title: Background depth + description: How dark the main surface sits. Higher = deeper black. + type: variable-number-slider + default: 24.5 + min: 16 + max: 32 + step: 0.5 + format: '%' + - + id: cc-radius + title: Corner radius + description: Softness of panels, chips and buttons. + type: variable-number + default: 9 + min: 0 + max: 16 + step: 1 + format: px + - + id: cc-font-size + title: Font size + description: Base text size across notes. + type: variable-number-slider + default: 16 + min: 12 + max: 24 + step: 0.5 + format: px + - + id: cc-mono-ui + title: Monospace everything + description: Use the mono font across the whole UI for a terminal feel. + type: class-toggle + default: false + - + id: cc-heading-prompt + title: ✳ glyph before H1 + description: Prefix top-level headings with the accent prompt glyph. + type: class-toggle + default: false +*/ + +/* -------------------------------------------------------------------------- + Shared knobs + -------------------------------------------------------------------------- */ +.theme-dark, +.theme-light { + --cc-bg-depth: 24.5%; + --cc-radius: 9px; + + --radius-s: calc(var(--cc-radius) - 3px); + --radius-m: var(--cc-radius); + --radius-l: calc(var(--cc-radius) + 3px); +} + +/* -------------------------------------------------------------------------- + DARK — base = Claude Code look (applies when no/other look class present) + -------------------------------------------------------------------------- */ +.theme-dark { + --cc-accent: #d97757; /* Anthropic coral */ + --accent-h: 15; --accent-s: 63%; --accent-l: 60%; + + /* Derived accent siblings — recompute automatically when --cc-accent changes */ + --cc-coral: var(--cc-accent); + --cc-coral-hover: oklch(from var(--cc-accent) calc(l + 0.05) c h); + --cc-coral-soft: oklch(from var(--cc-accent) l 0.07 h / 0.16); + + /* Warm neutral ramp (hue ~70°) */ + --background-primary: oklch(var(--cc-bg-depth) 0.006 70); + --background-primary-alt: oklch(calc(var(--cc-bg-depth) + 2.5%) 0.006 70); + --background-secondary: oklch(calc(var(--cc-bg-depth) - 3.5%) 0.006 65); + --background-secondary-alt: oklch(calc(var(--cc-bg-depth) - 5.5%) 0.006 65); + + --background-modifier-border: oklch(0.33 0.006 70); + --background-modifier-border-hover: oklch(0.40 0.006 70); + --background-modifier-border-focus: var(--cc-coral); + --background-modifier-hover: oklch(1 0 0 / 0.045); + --background-modifier-active-hover: var(--cc-coral-soft); + --background-modifier-form-field: oklch(calc(var(--cc-bg-depth) - 6%) 0.006 65); + + --text-normal: oklch(0.905 0.008 80); + --text-muted: oklch(0.705 0.008 78); + --text-faint: oklch(0.525 0.008 76); + --text-on-accent: oklch(0.20 0.01 70); + --text-accent: var(--cc-coral); + --text-accent-hover: var(--cc-coral-hover); + --text-selection: var(--cc-coral-soft); + + --interactive-normal: oklch(calc(var(--cc-bg-depth) + 4%) 0.006 70); + --interactive-hover: oklch(calc(var(--cc-bg-depth) + 7%) 0.006 70); + --interactive-accent: var(--cc-coral); + --interactive-accent-hover: var(--cc-coral-hover); + + --titlebar-background: oklch(calc(var(--cc-bg-depth) - 5.5%) 0.006 65); + --titlebar-background-focused: oklch(calc(var(--cc-bg-depth) - 3.5%) 0.006 65); + --titlebar-text-color: var(--text-muted); + --tab-background-active: var(--background-primary); + + /* Heading ladder — each level its own hue, readable on dark */ + --h1-color: oklch(0.80 0.125 35); /* coral-red */ + --h2-color: oklch(0.82 0.105 70); /* amber */ + --h3-color: oklch(0.83 0.100 130); /* green */ + --h4-color: oklch(0.82 0.085 200); /* teal */ + --h5-color: oklch(0.80 0.090 255); /* blue */ + --h6-color: oklch(0.78 0.095 310); /* violet */ + --inline-title-color: oklch(0.95 0.008 80); + + --code-background: oklch(calc(var(--cc-bg-depth) - 6%) 0.006 65); + --code-normal: oklch(0.86 0.01 80); + --code-comment: var(--text-faint); + --code-string: oklch(0.80 0.07 95); + --code-keyword: var(--cc-coral); + --code-function: oklch(0.80 0.06 60); + --code-property: oklch(0.82 0.04 230); + --code-value: oklch(0.80 0.07 95); + + --blockquote-border-color: var(--background-modifier-border-hover); + --hr-color: var(--background-modifier-border); + --checkbox-color: var(--cc-coral); + --checkbox-color-hover: var(--cc-coral-hover); + --list-marker-color: var(--text-faint); + --tag-background: var(--cc-coral-soft); + --tag-color: var(--cc-coral); + + --scrollbar-thumb-bg: oklch(1 0 0 / 0.08); + --scrollbar-active-thumb-bg: oklch(1 0 0 / 0.16); + --scrollbar-bg: transparent; +} + +/* -------------------------------------------------------------------------- + DARK — OpenAI Codex override (cool neutral black + teal-green) + Only the differences from the Claude base. Accent-derived tokens repaint + themselves because they reference --cc-accent. + -------------------------------------------------------------------------- */ +.cc-look-codex.theme-dark { + --cc-accent: #1ba884; /* OpenAI teal-green */ + --accent-h: 165; --accent-s: 64%; --accent-l: 45%; + + /* Cool, near-neutral ramp (hue ~255°, lower chroma) */ + --background-primary: oklch(var(--cc-bg-depth) 0.004 255); + --background-primary-alt: oklch(calc(var(--cc-bg-depth) + 2.5%) 0.004 255); + --background-secondary: oklch(calc(var(--cc-bg-depth) - 3.5%) 0.004 255); + --background-secondary-alt: oklch(calc(var(--cc-bg-depth) - 5.5%) 0.004 255); + + --background-modifier-border: oklch(0.33 0.004 255); + --background-modifier-border-hover: oklch(0.40 0.004 255); + --background-modifier-form-field: oklch(calc(var(--cc-bg-depth) - 6%) 0.004 255); + + --text-normal: oklch(0.920 0.004 250); + --text-muted: oklch(0.710 0.005 250); + --text-faint: oklch(0.530 0.005 250); + --text-on-accent: oklch(0.18 0.02 255); + + --titlebar-background: oklch(calc(var(--cc-bg-depth) - 5.5%) 0.004 255); + --titlebar-background-focused: oklch(calc(var(--cc-bg-depth) - 3.5%) 0.004 255); + + --inline-title-color: oklch(0.96 0.004 250); + + --code-background: oklch(calc(var(--cc-bg-depth) - 6%) 0.004 255); + --code-normal: oklch(0.86 0.006 250); + --code-string: oklch(0.80 0.10 168); /* greenish strings */ + --code-function: oklch(0.82 0.05 230); + --code-property: oklch(0.82 0.05 200); +} + +/* -------------------------------------------------------------------------- + LIGHT — base = Claude Code (paper); Codex override below + -------------------------------------------------------------------------- */ +.theme-light { + --cc-accent: #c5613f; + --accent-h: 15; --accent-s: 58%; --accent-l: 50%; + + --cc-coral: var(--cc-accent); + --cc-coral-hover: oklch(from var(--cc-accent) calc(l - 0.05) c h); + --cc-coral-soft: oklch(from var(--cc-accent) 0.55 0.08 h / 0.14); + + --background-primary: oklch(0.985 0.004 85); + --background-primary-alt: oklch(0.965 0.005 85); + --background-secondary: oklch(0.955 0.006 85); + --background-secondary-alt: oklch(0.93 0.006 85); + + --background-modifier-border: oklch(0.90 0.006 85); + --background-modifier-border-hover: oklch(0.84 0.006 85); + --background-modifier-hover: oklch(0 0 0 / 0.04); + --background-modifier-form-field: oklch(1 0 0); + + --text-normal: oklch(0.30 0.012 70); + --text-muted: oklch(0.50 0.010 72); + --text-faint: oklch(0.66 0.008 74); + --text-on-accent: oklch(0.99 0 0); + --text-accent: var(--cc-coral); + + --interactive-accent: var(--cc-coral); + --interactive-accent-hover: var(--cc-coral-hover); + + /* Heading ladder — darker for contrast on paper */ + --h1-color: oklch(0.52 0.16 35); + --h2-color: oklch(0.55 0.13 70); + --h3-color: oklch(0.50 0.12 140); + --h4-color: oklch(0.52 0.10 210); + --h5-color: oklch(0.50 0.12 260); + --h6-color: oklch(0.50 0.13 315); + --checkbox-color: var(--cc-coral); + --tag-background: var(--cc-coral-soft); + --tag-color: var(--cc-coral); +} + +.cc-look-codex.theme-light { + --cc-accent: #0f9f7a; + --accent-h: 165; --accent-s: 62%; --accent-l: 38%; + + --background-primary: oklch(0.985 0.003 250); + --background-primary-alt: oklch(0.965 0.004 250); + --background-secondary: oklch(0.955 0.005 250); + --background-secondary-alt: oklch(0.93 0.005 250); + + --background-modifier-border: oklch(0.90 0.005 250); + --background-modifier-border-hover: oklch(0.84 0.005 250); + + --text-normal: oklch(0.28 0.008 250); + --text-muted: oklch(0.49 0.007 250); + --text-faint: oklch(0.66 0.006 250); +} + +/* -------------------------------------------------------------------------- + PAPER (Courier) — light mint typewriter look. + body. beats .theme-light/.theme-dark, so it always reads as paper, + regardless of Obsidian's light/dark toggle. + -------------------------------------------------------------------------- */ +body.cc-look-paper { + --cc-accent: #d39a67; /* backlink */ + --accent-h: 29; --accent-s: 58%; --accent-l: 61%; + + --cc-coral: var(--cc-accent); + --cc-coral-hover: #bd8650; + --cc-coral-soft: #d39a672e; + --cc-paper-underline: #b37b40; /* backlink underline */ + --cc-paper-italic: #c86f2b; + --cc-paper-bold: #c86f2b; + + --background-primary: #eef8f0; + --background-primary-alt: #e8f4ea; + --background-secondary: #e4f1e7; + --background-secondary-alt: #dcecdf; + + --background-modifier-border: #cfe1d3; + --background-modifier-border-hover: #bcd4c1; + --background-modifier-hover: #37553a14; + --background-modifier-form-field: #f6fbf7; + + --text-normal: #37553a; + --text-muted: #5e7a62; + --text-faint: #93a896; + --text-on-accent: #ffffff; + --text-accent: var(--cc-accent); + --text-selection: #d39a6740; + + --interactive-accent: var(--cc-accent); + --interactive-accent-hover: var(--cc-coral-hover); + + --titlebar-background: #e4f1e7; + --titlebar-background-focused: #e8f4ea; + --tab-background-active: #eef8f0; + + --h1-color: #143d22; + --h2-color: #1c5230; + --h3-color: #24683e; + --h4-color: #2d7e4d; + --h5-color: #36945c; + --h6-color: #3faa6a; + --inline-title-color: #143d22; + + --code-background: #e4f1e7; + --code-normal: #37553a; + + --blockquote-border-color: #cfe1d3; + --hr-color: #cfe1d3; + --checkbox-color: var(--cc-accent); + --tag-background: #d39a672e; + --tag-color: #8a5e30; + --list-marker-color: #93a896; + + --scrollbar-thumb-bg: #37553a26; + --scrollbar-active-thumb-bg: #37553a40; + + /* Courier Prime everywhere — typewriter feel */ + --font-text-theme: "Source Code Pro", ui-monospace, monospace; + --font-interface-theme: "Source Code Pro", ui-monospace, monospace; + --font-monospace-theme: "Source Code Pro", ui-monospace, monospace; +} + +/* Paper DARK — inverted: dark-green surfaces, mint text. Accent (tan) stays. + Triggered by Obsidian's dark mode while the Paper look is active. */ +body.cc-look-paper.theme-dark { + --cc-paper-italic: #d39a67; + --cc-paper-bold: #d39a67; + + --background-primary: #272822; + --background-primary-alt: #2f302a; + --background-secondary: #212219; + --background-secondary-alt: #1b1c15; + + --background-modifier-border: #49483e; + --background-modifier-border-hover: #5f5d50; + --background-modifier-hover: #eef8f012; + --background-modifier-form-field: #21221b; + --table-border-color: #5a594d; + + --text-normal: #eef8f0; + --text-muted: #bdd3c0; + --text-faint: #8aa68f; + --text-selection: #d39a6740; + + --titlebar-background: #212219; + --titlebar-background-focused: #272822; + --tab-background-active: #272822; + + --h1-color: #d0eed4; + --h2-color: #b2e3b8; + --h3-color: #94d89c; + --h4-color: #76cc80; + --h5-color: #57bf64; + --h6-color: #38b348; + --inline-title-color: #d0eed4; + + --code-background: #21221b; + --code-normal: #eef8f0; + + --blockquote-border-color: #49483e; + --hr-color: #49483e; + --tag-background: #d39a672e; + --tag-color: #e3c4a0; + --list-marker-color: #8aa68f; + + --scrollbar-thumb-bg: #eef8f021; + --scrollbar-active-thumb-bg: #eef8f038; +} + +/* Paper: justified body (reading view) + underlined tan backlinks */ +body.cc-look-paper .markdown-preview-view p, +body.cc-look-paper .markdown-rendered p { + text-align: justify; + hyphens: auto; +} +body.cc-look-paper .internal-link, +body.cc-look-paper .cm-hmd-internal-link, +body.cc-look-paper .markdown-rendered a { + color: var(--cc-accent); + text-decoration: underline; + text-decoration-color: var(--cc-paper-underline); + text-underline-offset: 3px; +} + +/* Paper: bold/italic styled orange */ +body.cc-look-paper .markdown-rendered strong, +body.cc-look-paper .markdown-rendered b, +body.cc-look-paper .cm-s-obsidian .cm-strong { + color: var(--cc-paper-bold) !important; +} +body.cc-look-paper .markdown-rendered em, +body.cc-look-paper .markdown-rendered i, +body.cc-look-paper .cm-s-obsidian .cm-em { + color: var(--cc-paper-italic) !important; +} + +/* Paper (light only): table/Bases borders read too faint on the pale mint bg */ +body.cc-look-paper.theme-light { + --table-border-color: #9fb8a4; + --background-modifier-border: #bcd1c0; +} +body.cc-look-paper.theme-light .markdown-rendered th, +body.cc-look-paper.theme-light .markdown-rendered td, +body.cc-look-paper.theme-light .bases-table-cell, +body.cc-look-paper.theme-light .bases-th, +body.cc-look-paper.theme-light .bases-td { + border-color: #9fb8a4; +} + +/* Paper (dark): active file dot in Monokai green */ +body.cc-look-paper.theme-dark .nav-file-title.is-active .nav-file-title-content::before, +body.cc-look-paper.theme-dark .nav-file-title.has-focus .nav-file-title-content::before { + background: #a6e22e; + border-color: #a6e22e; +} + +/* Source Code Pro has real weights — Medium (500) as the base reads solid + without being heavy, real bold (700) stays distinct */ +body.cc-look-paper { --bold-weight: 700; } +body.cc-look-paper .markdown-preview-view, +body.cc-look-paper .markdown-source-view .cm-content, +body.cc-look-paper .inline-title, +body.cc-look-paper .nav-files-container, +body.cc-look-paper .workspace-tab-header, +body.cc-look-paper .status-bar { font-weight: 500; } + +/* -------------------------------------------------------------------------- + Typography + -------------------------------------------------------------------------- */ +body { + --font-text-theme: "Inter", ui-sans-serif, -apple-system, "Segoe UI", system-ui, sans-serif; + --font-interface-theme: "Inter", ui-sans-serif, -apple-system, "Segoe UI", system-ui, sans-serif; + --font-monospace-theme: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Consolas, monospace; + + --cc-font-size: 16px; + --font-text-size: var(--cc-font-size); + --line-height-normal: 1.6; + + --h1-weight: 620; + --h2-weight: 600; + --h3-weight: 600; + --bold-weight: 640; +} + +.markdown-preview-sizer, +.markdown-source-view.mod-cm6 .cm-sizer { max-width: 72ch; } + +body.cc-mono-ui { + --font-text-theme: var(--font-monospace-theme); + --font-interface-theme: var(--font-monospace-theme); +} + +/* -------------------------------------------------------------------------- + App chrome — shared, driven entirely by the tokens above + -------------------------------------------------------------------------- */ +.workspace-ribbon.side-dock-ribbon { background: var(--background-secondary-alt); border: none; } +.workspace-ribbon.side-dock-ribbon::before { display: none; } +.side-dock-ribbon-action { color: var(--text-faint); border-radius: var(--radius-s); } +.side-dock-ribbon-action:hover { color: var(--cc-coral); background: var(--background-modifier-hover); } + +.workspace-split.mod-left-split, +.workspace-split.mod-right-split { background: var(--background-secondary); } +.workspace-split.mod-left-split .workspace-tabs { background: var(--background-secondary); } + +.workspace-tab-header { border-radius: var(--radius-s); color: var(--text-faint); } +.workspace-tab-header.is-active { color: var(--text-normal); } +.workspace-tab-header.is-active .workspace-tab-header-inner { + background: var(--background-modifier-hover); + border-radius: var(--radius-s); +} +.workspace-tab-header-container { border-bottom: 1px solid var(--background-modifier-border); } + +/* ── File explorer reskinned like the Claude Code "Recents" sidebar ────── */ +body { --nav-indentation-guide-color: transparent; } + +.workspace-leaf-content[data-type="file-explorer"] .nav-files-container { padding: 2px 4px 8px; } + +/* rows: airy, rounded, quiet */ +.nav-file-title, +.nav-folder-title { + border-radius: var(--radius-s); + margin: 1px 4px; + padding: 5px 9px; + color: var(--text-muted); + font-size: 0.86em; + line-height: 1.35; +} +.tree-item-self:hover { + background: color-mix(in oklab, var(--text-normal) 5%, transparent); + color: var(--text-normal); +} + +/* leading status dot before each file (hollow), like Claude's recents */ +.nav-file-title-content::before { + content: ""; + display: inline-block; + width: 5px; + height: 5px; + margin-right: 9px; + border-radius: 50%; + border: 1.5px solid var(--text-faint); + vertical-align: middle; + transition: background-color 140ms ease, border-color 140ms ease; +} +.nav-file-title:hover .nav-file-title-content::before { border-color: var(--text-muted); } + +/* active file: neutral rounded fill + filled accent dot + brighter text */ +.nav-file-title.is-active, +.nav-file-title.has-focus { + background: color-mix(in oklab, var(--text-normal) 9%, transparent); + color: var(--text-normal); + font-weight: 560; +} +.nav-file-title.is-active .nav-file-title-content::before, +.nav-file-title.has-focus .nav-file-title-content::before { + background: var(--cc-coral); + border-color: var(--cc-coral); +} + +/* folders: quiet section-header feel */ +.nav-folder-title { + color: var(--text-normal); + font-weight: 580; +} +.nav-folder-title .nav-folder-collapse-indicator { color: var(--text-faint); } +.nav-folder.mod-root > .nav-folder-title { display: none; } + +.inline-title { letter-spacing: -0.01em; } + +/* Bold & italic carry the accent color */ +body { --bold-color: var(--cc-coral); --italic-color: var(--cc-coral); } +.markdown-rendered strong, +.markdown-rendered b, +.cm-s-obsidian .cm-strong { color: var(--cc-coral) !important; } +.markdown-rendered em, +.markdown-rendered i, +.cm-s-obsidian .cm-em { color: var(--cc-coral) !important; } + +/* Color-coded heading ladder in both reading view and Live Preview */ +.markdown-rendered h1, .cm-s-obsidian .HyperMD-header-1, .cm-s-obsidian .cm-header-1 { color: var(--h1-color); } +.markdown-rendered h2, .cm-s-obsidian .HyperMD-header-2, .cm-s-obsidian .cm-header-2 { color: var(--h2-color); } +.markdown-rendered h3, .cm-s-obsidian .HyperMD-header-3, .cm-s-obsidian .cm-header-3 { color: var(--h3-color); } +.markdown-rendered h4, .cm-s-obsidian .HyperMD-header-4, .cm-s-obsidian .cm-header-4 { color: var(--h4-color); } +.markdown-rendered h5, .cm-s-obsidian .HyperMD-header-5, .cm-s-obsidian .cm-header-5 { color: var(--h5-color); } +.markdown-rendered h6, .cm-s-obsidian .HyperMD-header-6, .cm-s-obsidian .cm-header-6 { color: var(--h6-color); } + +.cc-heading-prompt .markdown-rendered h1::before, +.cc-heading-prompt .HyperMD-header-1::before { + content: "✳ "; + color: var(--cc-coral); + font-weight: 600; +} + +.markdown-rendered code, +:not(pre) > code { + background: var(--code-background); + border: 1px solid var(--background-modifier-border); + border-radius: var(--radius-s); + padding: 0.08em 0.4em; + font-size: 0.88em; +} +.markdown-rendered pre { + background: var(--code-background); + border: 1px solid var(--background-modifier-border); + border-radius: var(--radius-m); +} + +.cm-cursor, .cm-cursor-primary { border-left: 2px solid var(--cc-coral) !important; } + +.cm-s-obsidian .cm-link, +.cm-s-obsidian .cm-url, +.markdown-rendered a { color: var(--cc-coral); text-decoration: none; } +.markdown-rendered a:hover { text-decoration: underline; text-underline-offset: 3px; } + +.markdown-rendered a.tag, +.cm-s-obsidian .cm-hashtag { + background: var(--tag-background); + color: var(--tag-color); + border: none; + border-radius: 999px; + padding: 0.05em 0.55em; + font-size: 0.82em; + font-weight: 540; +} + +.markdown-rendered blockquote { + border-left: 2px solid var(--background-modifier-border-hover); + color: var(--text-muted); + font-style: normal; +} + +button.mod-cta, .mod-cta { + background: var(--cc-coral); + color: var(--text-on-accent); + font-weight: 600; + border-radius: var(--radius-s); +} +button.mod-cta:hover, .mod-cta:hover { background: var(--cc-coral-hover); } +button:not(.mod-cta), .clickable-icon { border-radius: var(--radius-s); } + +.prompt { + background: var(--background-secondary); + border: 1px solid var(--background-modifier-border); + border-radius: var(--radius-l); +} +.prompt-input { background: transparent; } +.suggestion-item.is-selected { background: var(--cc-coral-soft); border-radius: var(--radius-s); } +.search-input-container input { border-radius: var(--radius-s); } + +.status-bar { + background: var(--background-secondary-alt); + border-top: 1px solid var(--background-modifier-border); + color: var(--text-faint); +} +.titlebar { border-bottom: 1px solid var(--background-modifier-border); } + +input[type="checkbox"]:checked { background-color: var(--cc-coral); border-color: var(--cc-coral); } + +.markdown-rendered th { color: var(--text-muted); font-weight: 600; } +.markdown-rendered table { border-radius: var(--radius-s); overflow: hidden; } + +::-webkit-scrollbar { width: 11px; height: 11px; } +::-webkit-scrollbar-thumb { + background: var(--scrollbar-thumb-bg); + border: 3px solid transparent; + background-clip: padding-box; + border-radius: 999px; +} +::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-active-thumb-bg); background-clip: padding-box; } + +::selection { background: var(--cc-coral-soft); } + +/* Plugins in Settings shown as cards */ +.installed-plugins-container .setting-item, +.community-modal-search-results .community-item { + border: 1px solid var(--background-modifier-border); + border-radius: var(--radius-m); + margin-bottom: 8px; + padding: 13px 15px; + background: var(--background-primary-alt); + transition: border-color 140ms ease, background-color 140ms ease; +} +.installed-plugins-container .setting-item:hover, +.community-modal-search-results .community-item:hover { + border-color: var(--background-modifier-border-hover); + background: var(--background-secondary); +} +.installed-plugins-container .setting-item-name { font-weight: 600; } + +.tree-item-self, .workspace-tab-header, .side-dock-ribbon-action, button, .clickable-icon { + transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), + color 160ms cubic-bezier(0.22, 1, 0.36, 1); +}