Skip to content

size.tabs: линия таблиста и размер вкладки из токенов - #119

Open
khaliulin wants to merge 1 commit into
mainfrom
size.tabs
Open

size.tabs: линия таблиста и размер вкладки из токенов#119
khaliulin wants to merge 1 commit into
mainfrom
size.tabs

Conversation

@khaliulin

Copy link
Copy Markdown
Contributor

Ветка от main. Второй компонент группы «значения, подогнанные под базу 14» — пункт §6 плана tabs.ts:22.

Что сделано

Линия таблиста — из токена. Стояло border-bottom: 0.15rem (2.1px при базе 14, 2.4px при 16). В экспорте для этого есть tabs.tablist.borderWidth = 0 0 1px 0. Aura применяет его к .p-tablist-tab-list, ширина которого равна контенту, поэтому кит рисует линию во всю ширину на .p-tablist — правило осталось, но толщина и стиль берутся из токена. Замер: 0px 0px 1px.

Типографика вкладки приведена к макету. Figma <Tabs> (884:7324) набирает вкладку стилем primary-font/text-base/font-medium: fontSize.200 без интерлиньяжа. В ките стояли fontSize.300 (на ступень крупнее) и не было line-height.

Вес — из токена компонента. Было fonts.fontWeight.demibold напрямую, стало tabs.tab.fontWeight (он и ссылается на demibold).

Stories. У двух примеров снята подложка bg-surface-ground.

Проверки

  • check-component tabs — было 1 FAIL (G2 сырой размер), стало 0 FAIL, 0 WARN
  • check-stories-bg tabs — подложек нет
  • check-dt-refs — мёртвых ссылок в tabs.ts нет
  • рантайм: линия 1px #e2e2e4, вкладка TT Fellows 14px/14px, gap 8px, дробных пикселей нет, консоль без ошибок
  • prettier --check чист
  • границы ветки: tokens/components/tabs.ts и stories/components/tabs/examples/

Вопросы к дизайну

  • вес вкладки. Текстовый стиль в макете привязывает fonts/fontWeight/medium (500) при начертании DemiBold, а токен tabs.tab.fontWeight = demibold (600). Применён токен: файла TT Fellows Medium в ките нет, при 500 браузер подставил бы Regular. Та же пара расхождений, что в divider и menu.
  • tabs.tab.padding = dimension.space.400 (0.875rem = 14px) против 14px в макете при базе 14 (1rem). Ступень space.400 расходится с макетом — уже третий случай после tooltip и popover.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant