add wireframes from current implementation; supersede claude-design
Five wireframes generated via the frame0-wireframe skill, sourced from JSON and rendered to PNG. Cover the welcome screen and four main-view states: default, editor-above-Claude (D-49), focus mode (D-52), sidebar-collapsed (D-51), and ticket detail in the context panel. The hi-fi mockups under docs/claude-design/ are now reference-only; README marks the bundle as superseded and points at docs/wireframes/ as the canonical source. The token files there still feed the runtime themes per D-43 / D-44, so the bundle is kept rather than removed. Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Claude
@@ -95,3 +95,6 @@ legacy/**/.coverage
|
||||
legacy/**/.coverage.*
|
||||
.clide/settings.yaml
|
||||
.claude/skills/pql/
|
||||
|
||||
# frame0-wireframe local ID ↔ Frame0 ID mapping; per-machine state.
|
||||
docs/wireframes/**/.*.idmap.json
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"exported_at": "2026-05-06T09:10:36Z",
|
||||
"exported_at": "2026-05-06T09:13:52Z",
|
||||
"decisions": [
|
||||
{
|
||||
"id": "D-1",
|
||||
|
||||
@@ -1,4 +1,25 @@
|
||||
# clide · design handoff
|
||||
# clide · design handoff (superseded reference)
|
||||
|
||||
> **Status (2026-05-06):** Reference-only. The implementation has
|
||||
> moved past these mockups. The canonical wireframe set now lives at
|
||||
> [`docs/wireframes/`](../wireframes/), generated from the actual
|
||||
> implementation via the `frame0-wireframe` skill.
|
||||
>
|
||||
> Update wireframes there, not here.
|
||||
>
|
||||
> **Why kept:** the design tokens under `tokens/` and `themes/` still
|
||||
> feed the runtime themes (per [D-43](../../decisions/architecture.md#d-43-design-handoff-adopt-token-palettes-reject-material-wrapper)
|
||||
> / [D-44](../../decisions/architecture.md#d-44-four-bundled-themes-clide-midnight-paper-terminal)).
|
||||
> The HTMLs and PNGs are kept for historical context.
|
||||
>
|
||||
> **What changed since:** welcome screen has logo-with-wordmark and a
|
||||
> Tips card spanning both columns; status line with theme switcher
|
||||
> lives at the bottom right; Claude pane runs in fullscreen mode
|
||||
> (`CLAUDE_CODE_NO_FLICKER=1`) so the input box is pinned by Claude
|
||||
> Code itself; tmux uses an isolated `-L clide` socket with bundled
|
||||
> config; sidebar layout follows D-47's "Claude is home" model.
|
||||
|
||||
---
|
||||
|
||||
Bundle for importing into the clide repo and driving further work with Claude Code.
|
||||
|
||||
|
||||
@@ -0,0 +1,53 @@
|
||||
# clide wireframes
|
||||
|
||||
Canonical layout reference, generated from the actual implementation
|
||||
via the `frame0-wireframe` skill. Each `.json` is the source of
|
||||
truth; the `.png` is rendered from it.
|
||||
|
||||
These supersede the hi-fi mockups under
|
||||
[`../claude-design/`](../claude-design/), which are kept for
|
||||
historical context and design tokens.
|
||||
|
||||
## Set
|
||||
|
||||
### Welcome
|
||||
- [`welcome/welcome-screen.json`](welcome/welcome-screen.json) /
|
||||
[.png](welcome/welcome-screen.png)
|
||||
— first-run landing: logo + wordmark, START / RECENT columns,
|
||||
Tips card, status line.
|
||||
|
||||
### Main view
|
||||
- [`main/main-view.json`](main/main-view.json) /
|
||||
[.png](main/main-view.png)
|
||||
— three-column default: tickets sidebar, Claude pane, empty
|
||||
context panel.
|
||||
- [`main/editor-above-claude.json`](main/editor-above-claude.json) /
|
||||
[.png](main/editor-above-claude.png)
|
||||
— D-49 editor mode: editor above Claude in the middle column,
|
||||
divider between, prompt Y stays fixed.
|
||||
- [`main/focus-mode.json`](main/focus-mode.json) /
|
||||
[.png](main/focus-mode.png)
|
||||
— D-52 focus mode: full-window Claude pane, sidebars hidden,
|
||||
Esc-to-exit hint in the title bar.
|
||||
- [`main/sidebar-collapsed.json`](main/sidebar-collapsed.json) /
|
||||
[.png](main/sidebar-collapsed.png)
|
||||
— D-51 12px spine: sidebar collapsed to a vertical strip with
|
||||
rotated label and activity badge.
|
||||
- [`main/ticket-detail.json`](main/ticket-detail.json) /
|
||||
[.png](main/ticket-detail.png)
|
||||
— context panel showing a selected ticket with metadata and
|
||||
description.
|
||||
|
||||
## Updating
|
||||
|
||||
1. Edit the `.json` (source of truth).
|
||||
2. Re-export with the `frame0-wireframe` skill:
|
||||
```
|
||||
.claude/skills/frame0-wireframe/scripts/frame0-sync.py \
|
||||
export docs/wireframes/<dir>/<name>.json \
|
||||
docs/wireframes/<dir>/<name>.png
|
||||
```
|
||||
3. Commit both files.
|
||||
|
||||
Frame0 must be running locally for export. Don't pull from Frame0 —
|
||||
the JSON is authoritative.
|
||||
@@ -0,0 +1,231 @@
|
||||
{
|
||||
"name": "Main View — editor above Claude",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 860,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 720, "top": 50,
|
||||
"text": "clide › clide ⌄ · src/welcome/welcome_view.dart ●",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"sidebar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 280, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"sidebar-section": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 96,
|
||||
"text": "▾ FILES",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"files-tree": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 124,
|
||||
"text": "▸ assets\n▸ bin\n▾ lib\n ▾ builtin\n ▾ welcome\n ▾ src\n welcome_view.dart\n extension.dart\n ▸ kernel\n ▸ widgets",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"sidebar-rail": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 822, "width": 280, "height": 40,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
|
||||
"editor-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 320, "top": 76, "width": 740, "height": 320,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"editor-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "editor-pane",
|
||||
"left": 320, "top": 76, "width": 740, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"editor-title": {
|
||||
"type": "Text",
|
||||
"parent": "editor-header",
|
||||
"left": 336, "top": 86,
|
||||
"text": "✎ welcome_view.dart ●",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"editor-demote": {
|
||||
"type": "Text",
|
||||
"parent": "editor-header",
|
||||
"left": 1024, "top": 86,
|
||||
"text": "👁 ⌘W",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-1": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 130,
|
||||
"text": " 1 class _TipsCard extends StatelessWidget {",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-2": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 148,
|
||||
"text": " 2 const _TipsCard({required this.tokens});",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-3": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 166,
|
||||
"text": " 3 final SurfaceTokens tokens;",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-4": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 184,
|
||||
"text": " 4",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-5": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 202,
|
||||
"text": " 5 static const _tips = <(String, String)>[",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
"editor-line-6": {
|
||||
"type": "Text",
|
||||
"parent": "editor-pane",
|
||||
"left": 336, "top": 220,
|
||||
"text": " 6 ('Quick open', '⌘P'),",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 320, "top": 396, "width": 740, "height": 4,
|
||||
"fillColor": "#262a32",
|
||||
"strokeColor": "#262a32"
|
||||
},
|
||||
|
||||
"claude-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 320, "top": 400, "width": 740, "height": 462,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 320, "top": 400, "width": 740, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-title": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 336, "top": 410,
|
||||
"text": "claude — primary",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-conv": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 336, "top": 460,
|
||||
"text": "› refactor _TipsCard into its own file\n\n● Moved _TipsCard to lib/builtin/welcome/src/tips_card.dart.\n Re-exported from welcome_view.dart for backwards compat.\n Updated test/builtin/welcome/widget_test.dart to import\n the new path.",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-prompt-divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 320, "top": 800, "width": 740, "height": 1,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-prompt": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 336, "top": 808,
|
||||
"text": "› Try \"run the tests\"",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"context-panel": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 1060, "top": 76, "width": 380, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"context-section": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 96,
|
||||
"text": "▾ PREVIEW",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"context-doc": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 134,
|
||||
"text": "Welcome screen\n\nThe first surface a user sees when no project is\nopen, or after closing one.\n\nLayout: centered max-850px column with logo +\nwordmark, START / RECENT row, and (when the\nviewport is tall enough) a TIPS card spanning\nthe full width.",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"status-branch": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 56, "top": 880,
|
||||
"text": "⑂ main ↑5 · 3 modified",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"status-app": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 700, "top": 880,
|
||||
"text": "● application ok",
|
||||
"fontColor": "#5a8c5a",
|
||||
"fontSize": 11
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 125 KiB |
@@ -0,0 +1,131 @@
|
||||
{
|
||||
"name": "Main View — focus mode",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 860,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 720, "top": 50,
|
||||
"text": "clide › clide ⌄ — focus mode",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"esc-hint": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 1340, "top": 50,
|
||||
"text": "Esc to exit",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"claude-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 1400, "height": 786,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 40, "top": 76, "width": 1400, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-title": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 56, "top": 86,
|
||||
"text": "claude — primary",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-subtitle": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 56, "top": 100,
|
||||
"text": "tmux · clide-claude-var-mnt-data-projects-clide · focus",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 10
|
||||
},
|
||||
|
||||
"claude-banner-icon": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 56, "top": 142,
|
||||
"text": "▰▰",
|
||||
"fontColor": "#d97757",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-banner-name": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 82, "top": 142,
|
||||
"text": "Claude Code v2.1.128",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-banner-meta": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 82, "top": 158,
|
||||
"text": "Opus 4.7 (1M context) with high effort · Claude Max",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"claude-msg-1-prompt": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 56, "top": 230,
|
||||
"text": "› switch to focus mode for the next push",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-msg-1-resp": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 56, "top": 258,
|
||||
"text": "● Focus mode entered. Esc to exit. Sidebar and context\n panel are hidden — Claude pane fills the workspace.",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"claude-prompt-divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 40, "top": 800, "width": 1400, "height": 1,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-prompt-caret": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 56, "top": 808,
|
||||
"text": "›",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"claude-prompt-placeholder": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 80, "top": 810,
|
||||
"text": "Try \"go full screen\"",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 12
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
@@ -0,0 +1,447 @@
|
||||
{
|
||||
"name": "Main View — project loaded",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 860,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [4, 4, 0, 0]
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 720, "top": 50,
|
||||
"text": "clide › clide ⌄",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"sidebar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 360, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"sidebar-search": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 92, "width": 280, "height": 32,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#262a32",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
"sidebar-search-icon": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-search",
|
||||
"left": 68, "top": 100,
|
||||
"text": "⌕",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 14
|
||||
},
|
||||
|
||||
"section-in-progress": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 142,
|
||||
"text": "▾ IN PROGRESS · 1",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-1": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 166, "width": 328, "height": 64,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#262a32",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
"ticket-1-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-1",
|
||||
"left": 70, "top": 178,
|
||||
"text": "● T-21 ← T-4",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-1-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-1",
|
||||
"left": 70, "top": 200,
|
||||
"text": "implement welcome screen per hi-fi design",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 13
|
||||
},
|
||||
|
||||
"section-ready": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 250,
|
||||
"text": "▾ READY · 3",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-2": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 274, "width": 328, "height": 56,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"ticket-2-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-2",
|
||||
"left": 70, "top": 282,
|
||||
"text": "● T-17 ← T-8",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-2-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-2",
|
||||
"left": 70, "top": 302,
|
||||
"text": "add dart doc generation to CI",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"ticket-3": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 332, "width": 328, "height": 56,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"ticket-3-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-3",
|
||||
"left": 70, "top": 340,
|
||||
"text": "● T-24 ← T-3",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-3-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-3",
|
||||
"left": 70, "top": 360,
|
||||
"text": "secondary Claude pane UI wiring",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"section-backlog": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 408,
|
||||
"text": "▾ BACKLOG · 33",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-4": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 432, "width": 328, "height": 50,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"ticket-4-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-4",
|
||||
"left": 70, "top": 440,
|
||||
"text": "● T-7 ← T-7",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-4-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-4",
|
||||
"left": 70, "top": 458,
|
||||
"text": "Tier 5 — canvas and graph view",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"ticket-5": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 484, "width": 328, "height": 50,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"ticket-5-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-5",
|
||||
"left": 70, "top": 492,
|
||||
"text": "● T-23 ← T-4",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-5-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-5",
|
||||
"left": 70, "top": 510,
|
||||
"text": "wire command palette keybinding",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"sidebar-rail": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 822, "width": 360, "height": 40,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"rail-icon-1": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 68, "top": 832,
|
||||
"text": "▤",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 16
|
||||
},
|
||||
"rail-icon-2": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 110, "top": 832,
|
||||
"text": "◇",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"rail-icon-3": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 152, "top": 832,
|
||||
"text": "▢",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"rail-icon-4": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 194, "top": 832,
|
||||
"text": "⑂",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"rail-icon-5": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 236, "top": 832,
|
||||
"text": "⌕",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"rail-icon-6": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar-rail",
|
||||
"left": 278, "top": 832,
|
||||
"text": "!",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
|
||||
"claude-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 400, "top": 76, "width": 660, "height": 786,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 400, "top": 76, "width": 660, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-title": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 416, "top": 86,
|
||||
"text": "claude — primary",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-subtitle": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 416, "top": 100,
|
||||
"text": "tmux · clide-claude-var-mnt-data-projects-clide",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 10
|
||||
},
|
||||
|
||||
"claude-logo-icon": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 142,
|
||||
"text": "▰▰",
|
||||
"fontColor": "#d97757",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-banner-name": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 442, "top": 142,
|
||||
"text": "Claude Code v2.1.128",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-banner-model": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 442, "top": 158,
|
||||
"text": "Opus 4.7 (1M context) with high effort · Claude Max",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"claude-banner-cwd": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 442, "top": 174,
|
||||
"text": "/var/mnt/data/projects/clide",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"claude-message-1": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 230,
|
||||
"text": "› wireframe the main view",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-response-1": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 258,
|
||||
"text": "● Building wireframe from current implementation. Three\n columns: sidebar (tickets shown), Claude pane, context\n panel. Let me check the tab contributions first.",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"claude-mcp-warn": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 720,
|
||||
"text": "1 MCP server failed · /mcp",
|
||||
"fontColor": "#d97757",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"claude-prompt-divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 400, "top": 752, "width": 660, "height": 1,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-prompt-caret": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 760,
|
||||
"text": "›",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"claude-prompt-placeholder": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 440, "top": 762,
|
||||
"text": "Try \"export the wireframes\"",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-prompt-meta": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 794,
|
||||
"text": "[jeroenschweitzer@danoontje clide] | Opus 4.7 (1M context)",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 10
|
||||
},
|
||||
|
||||
"context-panel": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 1060, "top": 76, "width": 380, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"context-empty": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 96,
|
||||
"text": "Select a ticket to view details.",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"context-rail": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 1060, "top": 822, "width": 380, "height": 40,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"context-rail-icon-1": {
|
||||
"type": "Text",
|
||||
"parent": "context-rail",
|
||||
"left": 1300, "top": 832,
|
||||
"text": "▤",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 16
|
||||
},
|
||||
"context-rail-icon-2": {
|
||||
"type": "Text",
|
||||
"parent": "context-rail",
|
||||
"left": 1340, "top": 832,
|
||||
"text": "◇",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"context-rail-icon-3": {
|
||||
"type": "Text",
|
||||
"parent": "context-rail",
|
||||
"left": 1380, "top": 832,
|
||||
"text": "⌕",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
"context-rail-icon-4": {
|
||||
"type": "Text",
|
||||
"parent": "context-rail",
|
||||
"left": 1416, "top": 832,
|
||||
"text": "▢",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
|
||||
"status-branch": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 56, "top": 880,
|
||||
"text": "⑂ main ↑5",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"status-app": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 700, "top": 880,
|
||||
"text": "● application ok",
|
||||
"fontColor": "#5a8c5a",
|
||||
"fontSize": 11
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 119 KiB |
@@ -0,0 +1,155 @@
|
||||
{
|
||||
"name": "Main View — sidebar collapsed",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 860,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 720, "top": 50,
|
||||
"text": "clide › clide ⌄",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"spine-left": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 12, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"spine-left-label": {
|
||||
"type": "Text",
|
||||
"parent": "spine-left",
|
||||
"left": 44, "top": 220,
|
||||
"text": "TICKETS",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 9
|
||||
},
|
||||
"spine-left-badge": {
|
||||
"type": "Ellipse",
|
||||
"parent": "spine-left",
|
||||
"left": 43, "top": 96, "width": 6, "height": 6,
|
||||
"fillColor": "#d97757",
|
||||
"strokeColor": "#d97757"
|
||||
},
|
||||
|
||||
"claude-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 52, "top": 76, "width": 1008, "height": 786,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 52, "top": 76, "width": 1008, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-title": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 68, "top": 86,
|
||||
"text": "claude — primary",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-subtitle": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 68, "top": 100,
|
||||
"text": "tmux · sidebar collapsed (⌘⇧1) — Tickets has activity",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 10
|
||||
},
|
||||
|
||||
"claude-banner": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 68, "top": 142,
|
||||
"text": "Claude Code v2.1.128 · Opus 4.7 (1M context)",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"claude-msg": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 68, "top": 200,
|
||||
"text": "› hide the sidebar, I want more room\n\n● Sidebar collapsed to a 12px spine. Activity badge\n on the spine indicates new ticket changes — click\n the spine or press ⌘⇧1 to expand.",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"claude-prompt-divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 52, "top": 800, "width": 1008, "height": 1,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-prompt": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 68, "top": 808,
|
||||
"text": "› Try \"show the sidebar again\"",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"context-panel": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 1060, "top": 76, "width": 380, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"context-section": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 96,
|
||||
"text": "▾ VIEWER",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"context-empty": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 134,
|
||||
"text": "Open a file to preview.",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"status-branch": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 56, "top": 880,
|
||||
"text": "⑂ main ↑5",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"status-app": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 700, "top": 880,
|
||||
"text": "● application ok",
|
||||
"fontColor": "#5a8c5a",
|
||||
"fontSize": 11
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
@@ -0,0 +1,269 @@
|
||||
{
|
||||
"name": "Main View — ticket detail in context",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 860,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1400, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 720, "top": 50,
|
||||
"text": "clide › clide ⌄",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"sidebar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 360, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"section": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 96,
|
||||
"text": "▾ IN PROGRESS · 1",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-selected": {
|
||||
"type": "Rectangle",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 122, "width": 328, "height": 64,
|
||||
"fillColor": "#1a1f28",
|
||||
"strokeColor": "#7c5cff",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
"ticket-selected-id": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-selected",
|
||||
"left": 70, "top": 134,
|
||||
"text": "● T-24 ← T-3",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-selected-title": {
|
||||
"type": "Text",
|
||||
"parent": "ticket-selected",
|
||||
"left": 70, "top": 156,
|
||||
"text": "secondary Claude pane UI wiring",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 13
|
||||
},
|
||||
|
||||
"section-2": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 56, "top": 210,
|
||||
"text": "▾ READY · 3",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-other-1": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 70, "top": 240,
|
||||
"text": "● T-17 add dart doc generation to CI",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"ticket-other-2": {
|
||||
"type": "Text",
|
||||
"parent": "sidebar",
|
||||
"left": 70, "top": 264,
|
||||
"text": "● T-21 implement welcome screen…",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"claude-pane": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 400, "top": 76, "width": 540, "height": 786,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-header": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 400, "top": 76, "width": 540, "height": 36,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-title": {
|
||||
"type": "Text",
|
||||
"parent": "claude-header",
|
||||
"left": 416, "top": 86,
|
||||
"text": "claude — primary",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-msg": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 142,
|
||||
"text": "› let's pick T-24 next\n\n● T-24 selected. Detail loaded in the right panel.\n This ticket wires up the secondary Claude pane UI —\n see D-41 for the spawn/close semantics.",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
"claude-prompt-divider": {
|
||||
"type": "Rectangle",
|
||||
"parent": "claude-pane",
|
||||
"left": 400, "top": 800, "width": 540, "height": 1,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"claude-prompt": {
|
||||
"type": "Text",
|
||||
"parent": "claude-pane",
|
||||
"left": 416, "top": 808,
|
||||
"text": "› Try \"start it\"",
|
||||
"fontColor": "#5a6478",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"context-panel": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 940, "top": 76, "width": 500, "height": 786,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"ticket-id": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 96,
|
||||
"text": "T-24 · task · ready",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"ticket-title": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 118,
|
||||
"text": "secondary Claude pane UI wiring",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 18
|
||||
},
|
||||
|
||||
"field-parent": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 162,
|
||||
"text": "Parent",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"field-parent-val": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 162,
|
||||
"text": "T-3 — Tier 1 — Claude in xterm pane, PTY, session",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"field-decision": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 188,
|
||||
"text": "Decision",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"field-decision-val": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 188,
|
||||
"text": "D-41 — Claude panes — one primary per repo, tmux-backed",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"field-priority": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 214,
|
||||
"text": "Priority",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"field-priority-val": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 214,
|
||||
"text": "medium",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"field-created": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 240,
|
||||
"text": "Created",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"field-created-val": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 1080, "top": 240,
|
||||
"text": "2026-04-22",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"desc-label": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 296,
|
||||
"text": "DESCRIPTION",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"desc-body": {
|
||||
"type": "Text",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 324,
|
||||
"text": "Wire the secondary Claude pane spawn flow into the\nUI: a “new Claude session” affordance in the pane\nchrome, secondary numbering (-1, -2 …), close-to-\nprimary focus collapse, and the visual distinction\nbetween primary and secondary in the pane header.",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"actions": {
|
||||
"type": "Rectangle",
|
||||
"parent": "context-panel",
|
||||
"left": 956, "top": 760, "width": 468, "height": 36,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#262a32",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
"action-start": {
|
||||
"type": "Text",
|
||||
"parent": "actions",
|
||||
"left": 974, "top": 770,
|
||||
"text": "▶ Start (status → in_progress)",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"status-branch": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 56, "top": 880,
|
||||
"text": "⑂ main ↑5",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 122 KiB |
@@ -0,0 +1,362 @@
|
||||
{
|
||||
"name": "Welcome Screen",
|
||||
"shapes": {
|
||||
"canvas": {
|
||||
"type": "Rectangle",
|
||||
"left": 40, "top": 40, "width": 1280, "height": 800,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
|
||||
"title-bar": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 40, "width": 1280, "height": 36,
|
||||
"fillColor": "#1c2028",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [4, 4, 0, 0]
|
||||
},
|
||||
"title-bar-text": {
|
||||
"type": "Text",
|
||||
"parent": "title-bar",
|
||||
"left": 660, "top": 50,
|
||||
"text": "clide ⌄",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"spine-left": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 40, "top": 76, "width": 12, "height": 700,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
"spine-right": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 1308, "top": 76, "width": 12, "height": 700,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028"
|
||||
},
|
||||
|
||||
"logo": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 240,
|
||||
"text": "<>",
|
||||
"fontColor": "#7c8896",
|
||||
"fontSize": 96
|
||||
},
|
||||
"logo-accent": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 254, "top": 332, "width": 60, "height": 4,
|
||||
"fillColor": "#d97757",
|
||||
"strokeColor": "#d97757"
|
||||
},
|
||||
|
||||
"wordmark": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 396, "top": 248,
|
||||
"text": "clide",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 64
|
||||
},
|
||||
"subtitle": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 396, "top": 322,
|
||||
"text": "IDE for Claude Code CLI",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 16
|
||||
},
|
||||
|
||||
"start-label": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 426,
|
||||
"text": "START",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"row-open": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 458, "width": 380, "height": 36,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#0e1014"
|
||||
},
|
||||
"row-open-icon": {
|
||||
"type": "Text",
|
||||
"parent": "row-open",
|
||||
"left": 262, "top": 466,
|
||||
"text": "▢",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-open-label": {
|
||||
"type": "Text",
|
||||
"parent": "row-open",
|
||||
"left": 296, "top": 468,
|
||||
"text": "Open folder…",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-open-key": {
|
||||
"type": "Text",
|
||||
"parent": "row-open",
|
||||
"left": 590, "top": 470,
|
||||
"text": "⌘O",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"row-clone": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 498, "width": 380, "height": 36,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#0e1014"
|
||||
},
|
||||
"row-clone-icon": {
|
||||
"type": "Text",
|
||||
"parent": "row-clone",
|
||||
"left": 262, "top": 506,
|
||||
"text": "⑂",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-clone-label": {
|
||||
"type": "Text",
|
||||
"parent": "row-clone",
|
||||
"left": 296, "top": 508,
|
||||
"text": "Clone from git…",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-clone-key": {
|
||||
"type": "Text",
|
||||
"parent": "row-clone",
|
||||
"left": 590, "top": 510,
|
||||
"text": "⌘G",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"row-claude": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 538, "width": 380, "height": 36,
|
||||
"fillColor": "#0e1014",
|
||||
"strokeColor": "#0e1014"
|
||||
},
|
||||
"row-claude-icon": {
|
||||
"type": "Text",
|
||||
"parent": "row-claude",
|
||||
"left": 262, "top": 546,
|
||||
"text": "◯",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-claude-label": {
|
||||
"type": "Text",
|
||||
"parent": "row-claude",
|
||||
"left": 296, "top": 548,
|
||||
"text": "Start a Claude session",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 14
|
||||
},
|
||||
"row-claude-key": {
|
||||
"type": "Text",
|
||||
"parent": "row-claude",
|
||||
"left": 590, "top": 550,
|
||||
"text": "⌘C",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"recent-label": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 700, "top": 426,
|
||||
"text": "RECENT",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"recent-row": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 700, "top": 458, "width": 410, "height": 56,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [4, 4, 4, 4]
|
||||
},
|
||||
"recent-name": {
|
||||
"type": "Text",
|
||||
"parent": "recent-row",
|
||||
"left": 716, "top": 468,
|
||||
"text": "clide",
|
||||
"fontColor": "#e8ecf2",
|
||||
"fontSize": 14
|
||||
},
|
||||
"recent-meta": {
|
||||
"type": "Text",
|
||||
"parent": "recent-row",
|
||||
"left": 716, "top": 490,
|
||||
"text": "/var/mnt/data/projects/clide · ⑂ main",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
"recent-time": {
|
||||
"type": "Text",
|
||||
"parent": "recent-row",
|
||||
"left": 1056, "top": 480,
|
||||
"text": "just now",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"tips-card": {
|
||||
"type": "Rectangle",
|
||||
"parent": "canvas",
|
||||
"left": 250, "top": 612, "width": 860, "height": 110,
|
||||
"fillColor": "#13161c",
|
||||
"strokeColor": "#1c2028",
|
||||
"corners": [6, 6, 6, 6]
|
||||
},
|
||||
"tips-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 274, "top": 628,
|
||||
"text": "TIPS",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
|
||||
"tip-1-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 274, "top": 660,
|
||||
"text": "Quick open",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-1-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 488, "top": 662,
|
||||
"text": "⌘P",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"tip-2-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 558, "top": 660,
|
||||
"text": "Command palette",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-2-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 766, "top": 662,
|
||||
"text": "⌘⇧P",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"tip-3-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 836, "top": 660,
|
||||
"text": "Toggle sidebar",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-3-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 1056, "top": 662,
|
||||
"text": "⌘B",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"tip-4-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 274, "top": 690,
|
||||
"text": "Toggle context",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-4-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 488, "top": 692,
|
||||
"text": "⌘J",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"tip-5-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 558, "top": 690,
|
||||
"text": "Switch theme",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-5-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 754, "top": 692,
|
||||
"text": "⌘K ⌘T",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
"tip-6-label": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 836, "top": 690,
|
||||
"text": "New Claude session",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 13
|
||||
},
|
||||
"tip-6-key": {
|
||||
"type": "Text",
|
||||
"parent": "tips-card",
|
||||
"left": 1054, "top": 692,
|
||||
"text": "⌘⇧C",
|
||||
"fontColor": "#a0a8b8",
|
||||
"fontSize": 12
|
||||
},
|
||||
|
||||
"status-version": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 940, "top": 798,
|
||||
"text": "clide 2.0.0-dev",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
},
|
||||
"status-app": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 1058, "top": 798,
|
||||
"text": "· application ok",
|
||||
"fontColor": "#5a8c5a",
|
||||
"fontSize": 11
|
||||
},
|
||||
"status-theme": {
|
||||
"type": "Text",
|
||||
"parent": "canvas",
|
||||
"left": 1180, "top": 798,
|
||||
"text": "· theme: clide",
|
||||
"fontColor": "#7a8294",
|
||||
"fontSize": 11
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
Reference in New Issue
Block a user