Skip to content

feat: adjust sm size to match type scale + make bigger - #738

Open
nandanmen wants to merge 1 commit into
cloudflare:mainfrom
nandanmen:nanda/fix-sm-size
Open

feat: adjust sm size to match type scale + make bigger#738
nandanmen wants to merge 1 commit into
cloudflare:mainfrom
nandanmen:nanda/fix-sm-size

Conversation

@nandanmen

@nandanmen nandanmen commented Aug 19, 2026

Copy link
Copy Markdown
Contributor

This PR updates the sm size for all components with an sm size to h-7.5 text-base instead of h-6.5 text-xs.

Before

CleanShot 2026-08-19 at 10 17 02@2x

After

CleanShot 2026-08-19 at 10 17 16@2x

Context

The sm button size in the Cloudflare dashboard has always felt too small and doesn't fit well with regular-sized type.

Why not remove it altogether? There's a genuine use case for buttons that are slightly smaller than 36px:

  • Navbar buttons, which are currently 32px (technically not a design system size):
CleanShot 2026-08-19 at 10 15 38@2x
  • Action buttons in a section header:
CleanShot 2026-08-19 at 10 15 35@2x
  • Reviews
    • bonk has reviewed the change
    • automated review not possible because:
  • Tests
    • Tests included/updated
    • Automated tests not possible - manual testing has been completed as follows:
    • Additional testing not necessary because:
@pkg-pr-new

pkg-pr-new Bot commented Aug 19, 2026

Copy link
Copy Markdown
npm i https://pkg.pr.new/@cloudflare/kumo@738

commit: 3bfc42b

@github-actions

Copy link
Copy Markdown
Contributor

Docs Preview

View docs preview

Commit: 3bfc42b

@github-actions

Copy link
Copy Markdown
Contributor
Visual Regression Report — 31 changed, 12 unchanged

31 screenshot(s) with visual changes:

Button / Sizes

1,306 px (1.47%) changed

Before After Diff
Before After Diff

Button / Icon Only

112 px (0.13%) changed

Before After Diff
Before After Diff

Button / Loading State

15 px (0.02%) changed

Before After Diff
Before After Diff

Button / Disabled State

182 px (0.21%) changed

Before After Diff
Before After Diff

Button / Title

405 px (0.46%) changed

Before After Diff
Before After Diff

Button / Link as Button

449 px (0.51%) changed

Before After Diff
Before After Diff

Dialog / Dialog With Actions

298 px (0.34%) changed

Before After Diff
Before After Diff

Dialog / Dialog Basic

397 px (0.45%) changed

Before After Diff
Before After Diff

Dialog / Dialog Sizes

964 px (1.09%) changed

Before After Diff
Before After Diff

Dialog / Dialog Alert

433 px (0.49%) changed

Before After Diff
Before After Diff

Dialog / Dialog Confirmation

1,498 px (1.69%) changed

Before After Diff
Before After Diff

Dialog / Custom Max Width

303 px (0.34%) changed

Before After Diff
Before After Diff

Dialog / Dialog With Select

491 px (0.55%) changed

Before After Diff
Before After Diff

Dialog / Dialog With Combobox

253 px (0.29%) changed

Before After Diff
Before After Diff

Dialog / Dialog With Dropdown

500 px (0.56%) changed

Before After Diff
Before After Diff

Dialog (Open)

241 px (0%) changed

Before After Diff
Before After Diff

Select / Select Basic

1,036 px (1.17%) changed

Before After Diff
Before After Diff

Select / Select Sizes

6,183 px (3.74%) changed

Before After Diff
Before After Diff

Select / Select Without Label

573 px (0.65%) changed

Before After Diff
Before After Diff

Select / Select With Description

2,015 px (1.94%) changed

Before After Diff
Before After Diff

Select / Select With Error

1,730 px (1.66%) changed

Before After Diff
Before After Diff

Select / Select Placeholder

1,234 px (1.39%) changed

Before After Diff
Before After Diff

Select / Select With Tooltip

1,053 px (1.19%) changed

Before After Diff
Before After Diff

Select / Select Loading

0 px (0%) changed

Before After Diff
Before After Diff

Select / Select Complex

1,677 px (1.61%) changed

Before After Diff
Before After Diff

Select / Select Disabled Options

1,520 px (1.72%) changed

Before After Diff
Before After Diff

Select / Select Disabled Items

631 px (0.71%) changed

Before After Diff
Before After Diff

Select / Select Grouped

1,022 px (1.15%) changed

Before After Diff
Before After Diff

Select / Select Grouped With Disabled

1,478 px (1.67%) changed

Before After Diff
Before After Diff

Select / Select Long List

1,517 px (1.46%) changed

Before After Diff
Before After Diff

Select (Open)

311,215 px (1.25%) changed

Before After Diff
Before After Diff
12 screenshot(s) unchanged
  • Button / Basic
  • Button / Variant: Primary
  • Button / Variant: Secondary
  • Button / Variant: Ghost
  • Button / Variant: Destructive
  • Button / Variant: Outline
  • Button / Variant: Secondary Destructive
  • Button / With Icon
  • Button / Link with Tooltip
  • Button / Disabled Link
  • Select / Select Custom Rendering
  • Select / Select Multiple

Generated by Kumo Visual Regression

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

Labels

None yet

1 participant