Skip to content

Commit 6264ef4

Browse files
committed
📝 Update README
1 parent 9291747 commit 6264ef4

7 files changed

Lines changed: 72 additions & 54 deletions

File tree

assets/demo.gif

115 KB
Loading

assets/screenshot.jpg

-635 KB
Binary file not shown.

scripts/demo.tape

Lines changed: 26 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,47 @@
1-
# deepx-code 演示录制脚本(vhs)
1+
# deepx-code 演示录制脚本(vhs)—— 工作模式切换
22
#
33
# 用法:
44
# brew install vhs # macOS;其它平台见 https://github.com/charmbracelet/vhs
55
# vhs scripts/demo.tape # 在仓库根目录跑,产出 assets/demo.gif
66
#
7-
# 注意:演示会真实启动 deepx 并发起一次模型调用(用 ~/.deepx/model.yaml 的 key),
8-
# 会消耗少量 flash token。Sleep 时长按本机/网络延迟可能需要微调——若 GIF 录到
9-
# “半截”状态,调大下面发送后的 Sleep
7+
# 前置:`deepx` 需在 PATH 且为最新构建(go install / make install),并已配置好
8+
# ~/.deepx/model.yaml(演示本身不发模型调用,但启动要读配置,否则会弹首启向导)。
9+
# 说明:本演示是纯 UI(/working-mode 弹窗选择),不消耗 token、时长确定,无需按网络微调
1010

1111
Output assets/demo.gif
1212

1313
Set Shell bash
1414
Set FontSize 16
1515
Set Width 1200
16-
Set Height 720
16+
Set Height 1000
1717
Set Padding 18
1818
Set Theme "Catppuccin Mocha"
1919

20-
# 在一个干净的小项目里启动(避免加载旧会话历史),等 TUI + codegraph 预热(不录这段)
20+
# 在一个干净空目录里启动,并清掉它的历史会话 → 每次都从空白界面开始(预热不录)。
21+
# 会话存于 ~/.deepx/sessions/<sha1(workspace)[:16]>,这里按同一算法定位并删除。
2122
Hide
22-
Type "cd /tmp/deepx-demo && deepx"
23+
Type "mkdir -p /tmp/deepx-demo; rm -rf ~/.deepx/sessions/$(printf %s /tmp/deepx-demo | shasum | cut -c1-16); clear; cd /tmp/deepx-demo && deepx"
2324
Enter
24-
Sleep 4s
25+
Sleep 5s
2526
Show
2627

27-
# 输入一个会触发 CodeGraph 的问题,展示:footer 活动行(思考→调用工具)+ 完成行
28-
Sleep 800ms
29-
Type "Greet 函数在哪定义、被谁调用?用 codegraph 查"
30-
Sleep 600ms
28+
# 展示完整初始界面:左 chat 区 + 右状态面板(banner / 工作区 / 模型 / 工作模式 / 沙箱 全可见)
29+
Sleep 2.2s
30+
31+
# 打开工作模式选择弹窗
32+
Type "/working-mode"
33+
Sleep 900ms
3134
Enter
35+
Sleep 1.6s
3236

33-
# 等模型 + 工具 + 回答(延迟不稳,留足缓冲;录到半截就调大)
34-
Sleep 14s
37+
# 在三种模式间切换:karpathy → openspec → superpowers → 回 openspec
38+
Down
39+
Sleep 1.1s
40+
Down
41+
Sleep 1.1s
42+
Up
43+
Sleep 1.1s
3544

36-
# 停在“✓ 完成”那一帧
37-
Sleep 2500ms
45+
# 应用 openspec —— 右栏「工作模式」与提示同步更新
46+
Enter
47+
Sleep 3.2s

tui/banner.go

Lines changed: 38 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,20 @@ import (
88
"github.com/charmbracelet/x/ansi"
99
)
1010

11-
// === deepx 文字 banner(给右栏顶部用)===
11+
// === deepx-code 文字 banner(右栏顶部)===
1212
//
1313
// 5 行布局:
14-
// - 顶 `/` 装饰条
15-
// - 3 行 5×3 block art "deepx",每个字母粉→紫渐变
16-
// - 底 `/` 装饰条
14+
// - 顶 ‹──────› 尖括号框
15+
// - 3 行 5×3 block art "deepx",每个字母青→蓝渐变;中间行尾接 "-code" 后缀
16+
// - 底 ‹──────› 尖括号框
1717
//
18-
// 之前还有一行 "deepx code™" 标签,跟 chat 区右栏顶部的文字 logo 重复,这里只留 art
18+
// 配色青→蓝、装饰用尖括号(代码母题),自有辨识度
1919
const (
2020
bannerArtRows = 3
2121
bannerArtWidth = 3*5 + 4 // 5 字母 × 3 列 + 4 字母间空格 = 19
22-
bannerMinWidth = bannerArtWidth
22+
bannerIndent = 2 // art 左缩进
23+
bannerSuffix = " -code"
24+
bannerMinWidth = bannerIndent + bannerArtWidth
2325
)
2426

2527
// deepxLetters 5 个字母的 3×3 像素艺术。
@@ -31,53 +33,59 @@ var deepxLetters = [5][bannerArtRows]string{
3133
{"█ █", "▀▄▀", "▀ ▀"}, // x
3234
}
3335

34-
// deepxLetterColors 每个字母一色,组成粉→紫渐变。ANSI 256 调色板等距取色,跨终端稳。
36+
// deepxLetterColors 每个字母一色,组成青→蓝渐变。ANSI 256 调色板等距取色,跨终端稳。
3537
var deepxLetterColors = [5]color.Color{
36-
lipgloss.Color("213"), // 亮粉
37-
lipgloss.Color("177"), // 粉紫
38-
lipgloss.Color("141"), // 中紫
39-
lipgloss.Color("105"), // 蓝紫
40-
lipgloss.Color("99"), // 深紫
38+
lipgloss.Color("51"), // 亮青
39+
lipgloss.Color("45"), //
40+
lipgloss.Color("39"), // 青蓝
41+
lipgloss.Color("33"), //
42+
lipgloss.Color("27"), // 索蓝
4143
}
4244

43-
// bannerDecoColor 上下 `/` 修饰条颜色。
44-
var bannerDecoColor color.Color = lipgloss.Color("63")
45+
// bannerSuffixColor "-code" 后缀色(浅灰,作字样副件);bannerDecoColor 尖括号框色(亦被
46+
// scrollbar 轨道 / reasoning 角色名复用,留作通用蓝色强调)。
47+
var (
48+
bannerSuffixColor color.Color = lipgloss.Color("250")
49+
bannerDecoColor color.Color = lipgloss.Color("67") // 钢蓝
50+
)
4551

4652
// renderBanner 返回 5 行 × width 列的 banner。width < bannerMinWidth 时返回空。
4753
func renderBanner(width int) string {
4854
if width < bannerMinWidth {
4955
return ""
5056
}
5157

52-
deco := lipgloss.NewStyle().
53-
Foreground(bannerDecoColor).
54-
Render(strings.Repeat("/", width))
58+
// 尖括号框:‹ + ─×(width-2) + ›
59+
deco := lipgloss.NewStyle().Foreground(bannerDecoColor).
60+
Render("‹" + strings.Repeat("", width-2) + "›")
5561

56-
leftPad := (width - bannerArtWidth) / 2
57-
if leftPad < 0 {
58-
leftPad = 0
59-
}
60-
padStr := strings.Repeat(" ", leftPad)
62+
pad := strings.Repeat(" ", bannerIndent)
63+
suffixFits := bannerIndent+bannerArtWidth+ansi.StringWidth(bannerSuffix) <= width
6164

6265
rows := make([]string, 0, 5)
6366
rows = append(rows, deco)
6467
for r := range bannerArtRows {
6568
var sb strings.Builder
66-
sb.WriteString(padStr)
69+
sb.WriteString(pad)
6770
for i, letter := range deepxLetters {
6871
if i > 0 {
6972
sb.WriteByte(' ')
7073
}
71-
sb.WriteString(lipgloss.NewStyle().
72-
Foreground(deepxLetterColors[i]).
73-
Render(letter[r]))
74+
sb.WriteString(lipgloss.NewStyle().Foreground(deepxLetterColors[i]).Render(letter[r]))
7475
}
75-
raw := sb.String()
76-
if cur := ansi.StringWidth(raw); cur < width {
77-
raw += strings.Repeat(" ", width-cur)
76+
if r == 1 && suffixFits { // 中间行尾接 "-code"
77+
sb.WriteString(lipgloss.NewStyle().Foreground(bannerSuffixColor).Render(bannerSuffix))
7878
}
79-
rows = append(rows, raw)
79+
rows = append(rows, padBannerRow(sb.String(), width))
8080
}
8181
rows = append(rows, deco)
8282
return strings.Join(rows, "\n")
8383
}
84+
85+
// padBannerRow 把行右补空格到 width 列(按显示宽度算,忽略 ANSI 转义)。
86+
func padBannerRow(s string, width int) string {
87+
if cur := ansi.StringWidth(s); cur < width {
88+
return s + strings.Repeat(" ", width-cur)
89+
}
90+
return s
91+
}

tui/model.go

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -411,17 +411,17 @@ func initialModel(models agent.ModelConfig, needsSetup bool, version string, hub
411411
ti.SetHeight(3)
412412
// 输入框样式定制:
413413
// - 第一行显示 "> ",后续行只缩进 2 空格(对齐到内容列)避免每行重复 prompt
414-
// - Prompt 染粉紫(同 banner 主色),focus / blur 状态都保留亮度
414+
// - Prompt 染亮青(同 banner 品牌主色),focus / blur 状态都保留亮度
415415
// - 内置 CursorLine 高亮(默认会给当前行加背景色)关掉,跟 chat 区无 chrome 风格一致
416416
tas := ti.Styles()
417417
tas.Focused.CursorLine = lipgloss.NewStyle()
418418
tas.Blurred.CursorLine = lipgloss.NewStyle()
419419
tas.Focused.Base = lipgloss.NewStyle()
420420
tas.Blurred.Base = lipgloss.NewStyle()
421-
// 光标样式:细竖条 + 粉紫色 + 缓慢 blink(600ms),跟 banner 主色一致,
421+
// 光标样式:细竖条 + 亮青色 + 缓慢 blink(600ms),跟 banner 品牌主色一致,
422422
// 避免默认 block 光标在中文/emoji 行上把字符整块反色显得突兀。
423423
tas.Cursor.Shape = tea.CursorBar
424-
tas.Cursor.Color = lipgloss.Color("213") // 亮粉,跟 banner deepx 渐变首色一致
424+
tas.Cursor.Color = lipgloss.Color("51") // 亮青,跟 banner X 品牌符首色一致
425425
tas.Cursor.Blink = true
426426
tas.Cursor.BlinkSpeed = 600 * time.Millisecond
427427
ti.SetStyles(tas)

tui/styles.go

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ var (
1919
// accent / highlight 给右栏 section 标题和强调元素。
2020
dimColor = lipgloss.Color("240")
2121
subtleColor = lipgloss.Color("8")
22-
accentColor = lipgloss.Color("12")
23-
highlightColor = lipgloss.Color("13")
22+
accentColor = lipgloss.Color("12") // 亮蓝:右栏 section 标题
23+
highlightColor = lipgloss.Color("51") // 亮青:强调元素(◆ / prompt / 光标)— 由 charm 品红改为 deepx 青蓝品牌色
2424

25-
// outerStyle 不再画外框 — 整个主 UI 直接贴终端边缘,跟 Crush 风格一致
25+
// outerStyle 不再画外框 — 整个主 UI 直接贴终端边缘,视觉更干净
2626
// 保留变量以兼容历史调用,但不带 border。
2727
outerStyle = lipgloss.NewStyle()
2828

tui/view.go

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,8 @@ const inputAreaHeight = 3 + inputTopPad + inputBotPad
5353
// textarea 实际宽度 = m.width - inputGutterWidth。
5454
const inputGutterWidth = 2
5555

56-
// inputPromptStyle 是 gutter 里 "❱ " 的样式(粉紫加粗,同 banner 主色)。
57-
var inputPromptStyle = lipgloss.NewStyle().Foreground(lipgloss.Color("99")).Bold(true)
56+
// inputPromptStyle 是 gutter 里 "❱ " 的样式(亮青加粗,同 banner 品牌主色)。
57+
var inputPromptStyle = lipgloss.NewStyle().Foreground(lipgloss.Color("51")).Bold(true)
5858

5959
var (
6060
scrollbarDividerStyle = lipgloss.NewStyle().Foreground(bannerDecoColor) // 轨道:暗色粗 ┃

0 commit comments

Comments
 (0)