Skip to Content
ДизайнОптимизация интервалов в TUI PR2 — полурядные цветовые полосы и компактные интервалы

Оптимизация интервалов в TUI PR2 — полурядные цветовые полосы и компактные интервалы

Контекст

PR1 предварительно сократил вертикальные интервалы в TUI за счет удаления лишних пустых строк внутри групп инструментов. Однако на практике остались две проблемы с удобством использования:

  1. Отсутствие визуального разделения между сообщениями пользователя и ответами ассистента — в длинных диалогах сложно быстро найти, “где начинается мой вопрос”.
  2. Интервалы между блоками все еще слишком велики — при чередовании вопросов и ответов остается целая пустая строка, что расходует место на экране.

Внесенные изменения

1. Полурядные цветовые полосы для сообщений пользователя

Вверху и внизу сообщений пользователя добавляются полувыеотные бледные линии, а для области контента устанавливается backgroundColor того же цвета, образуя три бесшовные цветовые полосы:

▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄ ← foreground = bandColor (окрашивание нижней половины ячейки) > Текст вопроса пользователя ← backgroundColor = bandColor (фон всей строки) ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ← foreground = bandColor (окрашивание верхней половины ячейки)
  • Цвет вычисляется с помощью subtleBandColor(): выполняется сдвиг чистой яркости на 6% относительно цвета фона (темный терминал → немного светлее, светлый терминал → немного темнее) без изменения цветового тона.
  • Терминалы без поддержки 24-битного цвета / программы чтения с экрана / окружения с NO_COLOR автоматически переключаются на обычное отображение (marginTop=1).
  • Защита от отрицательной/нулевой ширины.

2. Уменьшение интервалов между вопросами и ответами

ПозицияДо измененийПосле изменений
Над сообщением пользователя1 пустая строка0 (визуальное разделение обеспечивается цветовой полосой; при откате сохраняется marginTop=1)
Над выводом модели1 пустая строка1 пустая строка (сохранено для разделения процесса размышления и итогового вывода)
Над вызовами инструментов / сообщениями о статусе1 пустая строка0
В конце текста размышленияВозможны лишние переносы строкtrimEnd() для предотвращения двойных пустых строк

Последовательность “ответ → вызов инструмента → ответ” в рамках одного раунда диалога больше не содержит лишних пустых строк, что делает информацию более компактной и связной.

Сравнение результатов

До изменений:

(1 пустая строка) > Прочитай package.json (1 пустая строка) ✦ Хорошо, сейчас прочитаю файл. (1 пустая строка) ┌ Read package.json ─────────┐ │ ✓ Read package.json │ └────────────────────────────┘ (1 пустая строка) ✦ Содержимое файла: ... (1 пустая строка) ┌─ Поле ввода ──────────────┐

После изменений:

▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄ > Прочитай package.json ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ✦ Хорошо, сейчас прочитаю файл. ┌ Read package.json ─────────┐ │ ✓ Read package.json │ └────────────────────────────┘ (1 пустая строка) ✦ Содержимое файла: ... (1 пустая строка) ┌─ Поле ввода ──────────────┐

Без изменений

  • Стиль рамок вызовов инструментов остался без изменений.
  • Интервалы между абзацами основного текста Markdown остались без изменений (1 строка — это минимальная единица для терминала).
  • Цветовые значения темной/светлой темы не изменились.
  • Интервалы в области ввода (Composer) остались без изменений (marginTop=1).
Last updated on