chore(controls): apply control tokens by andrew-ronaldson · Pull Request #8121 · patternfly/patternfly

andrew-ronaldson · 2026-02-11T23:38:26Z

Closes #8018
This covers control buttons, form elements, Switch, input groups toggle group and menu toggles.

Summary by CodeRabbit

Style
- Updated default border color and border radius across Button, ClipboardCopy, FormControl, MenuToggle, Switch, TextInputGroup, and ToggleGroup so controls use more specific design tokens, refining the visual appearance of form and control elements without changing behavior.

This covers control buttons, form elements, Switch, input groups and menu toggles.

coderabbitai · 2026-02-11T23:38:36Z

Walkthrough

Replaced generic border color and radius tokens with control-specific tokens across seven components, changing references from --pf-t--global--border--color--default → --pf-t--global--border--color--control--default and --pf-t--global--border--radius--small → --pf-t--global--border--radius--control--form-element.

Changes

Cohort / File(s)	Summary
Control token updates (border color & radius) `src/patternfly/components/Button/button.scss`, `src/patternfly/components/FormControl/form-control.scss`, `src/patternfly/components/TextInputGroup/text-input-group.scss`	Replaced `--pf-t--global--border--radius--small` with `--pf-t--global--border--radius--control--form-element` and `--pf-t--global--border--color--default` with `--pf-t--global--border--color--control--default`.
Border color token updates `src/patternfly/components/ClipboardCopy/clipboard-copy.scss`, `src/patternfly/components/MenuToggle/menu-toggle.scss`, `src/patternfly/components/Switch/switch.scss`, `src/patternfly/components/ToggleGroup/toggle-group.scss`	Replaced `--pf-t--global--border--color--default` with `--pf-t--global--border--color--control--default` for component border defaults.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related issues

Buttons - Unified theme updates (Core) #8019 — Overlaps with "Buttons - Unified theme updates (Core)"; token changes to Button border radius/color match that objective.
#8018 (Form elements - Unified theme updates) — Aligns with unified theme updates for form/control tokens as described in the linked issue.

Suggested reviewers

lboehling
srambach

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title follows conventional commit guidelines with a proper scope and clear description of the changes.
Linked Issues check	✅ Passed	The PR successfully applies control tokens across form elements and related components, implementing the unified theme updates specified in `#8018` per design guidance.
Out of Scope Changes check	✅ Passed	All changes are scoped to applying control tokens across specified components, directly addressing the unified theme updates requirement from `#8018`.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

No actionable comments were generated in the recent review. 🎉

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

patternfly-build · 2026-02-11T23:41:26Z

Preview: https://pf-pr-8121.surge.sh

A11y report: https://pf-pr-8121-a11y.surge.sh

mcoker · 2026-02-12T00:00:49Z

@andrew-ronaldson checked that what's in the design-tokens repo is the latest from figma and put up a PR to add gray-45 and also looks like it's pulling in red-05. #8122

If that looks good, feel free to merge it and rebase your branch from main to pull it in.

Adding toggle group and copy clipboard updates

coderabbitai

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@src/patternfly/components/ClipboardCopy/clipboard-copy.scss`:
- Line 22: The CSS custom property for the clipboard-copy expandable content
border radius uses a non-existent token; update the value of
--#{$clipboard-copy}__expandable-content--BorderRadius to use the defined
control token --pf-t--global--border--radius--control--form-element so it
matches the rest of the codebase (FormControl, Button, TextInputGroup) and the
tokens in tokens-default.scss; simply replace the incorrect
--pf-t--global--border--radius--form-element with
--pf-t--global--border--radius--control--form-element in the clipboard-copy.scss
assignment.

srambach

L 🎛️ TM

mcoker

LGTM!

mcoker · 2026-02-16T21:19:13Z

@@ -193,12 +193,12 @@
  --#{$button}--m-plain--m-no-padding--border--offset: calc(#{pf-size-prem(2px)} * -1);



For the button component styles, just to confirm, we don't want to make the same change to the stateful button?

Will be updated in a separate issue for notification badge.

mcoker · 2026-02-16T21:24:57Z

@@ -12,7 +12,7 @@
  --#{$menu-toggle}--LineHeight: var(--pf-t--global--font--line-height--body);
  --#{$menu-toggle}--BackgroundColor: var(--pf-t--global--background--color--control--default);
  --#{$menu-toggle}--BorderRadius: var(--pf-t--global--border--radius--small);


Should the border radius change, too?

Pending for convo on things that appear in toolbars

mcoker · 2026-02-16T21:31:06Z

  --#{$toggle-group}__button--hover--after--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
  --#{$toggle-group}__button--before--BorderWidth: var(--pf-t--global--border--width--control--default);
-  --#{$toggle-group}__button--before--BorderColor: var(--pf-t--global--border--color--default);
+  --#{$toggle-group}__button--before--BorderColor: var(--pf-t--global--border--color--control--default);


Should we also update the border radius on toggle group? It does use a tiny radius currently, so if we updated it, it would change from 4px to 6px.

Will be updated in separate issue.

patternfly-build · 2026-02-18T15:58:54Z

🎉 This PR is included in version 6.5.0-prerelease.42 🎉

The release is available on:

Your semantic-release bot 📦🚀

chore(controls): apply control tokens

f3ae560

This covers control buttons, form elements, Switch, input groups and menu toggles.

andrew-ronaldson added 2 commits February 11, 2026 21:19

Merge branch 'patternfly:main' into control-tokens

53fb70b

chore(controls): apply control border

8f83a93

Adding toggle group and copy clipboard updates

andrew-ronaldson marked this pull request as ready for review February 12, 2026 16:31

andrew-ronaldson requested review from lboehling, mcoker and srambach and removed request for lboehling February 12, 2026 16:31

coderabbitai Bot reviewed Feb 12, 2026

View reviewed changes

Comment thread src/patternfly/components/ClipboardCopy/clipboard-copy.scss Outdated

chore(clipboard copy): fix radius token

c53b42b

srambach approved these changes Feb 12, 2026

View reviewed changes

mcoker approved these changes Feb 18, 2026

View reviewed changes

mcoker merged commit 9548cc1 into patternfly:main Feb 18, 2026
5 checks passed

patternfly-build added the released on @prerelease label Feb 18, 2026

This was referenced Feb 19, 2026

feat(ToggleGroup): unified theme updates #8154

Merged

Drawer splitter: New rounded variant #8164

Closed

Menu Toggle: update tokens and icons #8139

Closed

Label - update to unified tokens #8128

Open

Update icons to RH brand icons [core docs] #8127

Closed

mcoker mentioned this pull request Feb 26, 2026

Bug - Text input group - border shows on disabled #8178

Open

coderabbitai Bot mentioned this pull request Mar 12, 2026

feat(tabs): update to unified design icons and tokens #8216

Merged

This was referenced Mar 19, 2026

Table: Glass PR Token Followups #8233

Closed

fix(clipboard-copy): update icons and verify tokens #8228

Merged

This was referenced Apr 1, 2026

fix(breadcrumbs): update tokens and icons #8259

Merged

Notification Badge #8131

Closed

coderabbitai Bot mentioned this pull request Apr 21, 2026

feat(button): add plain variant #8305

Merged

This was referenced Jul 22, 2026

The automated release is failing 🚨 #8519

Closed

The automated release is failing 🚨 #8533

Closed

		@@ -193,12 +193,12 @@
		--#{$button}--m-plain--m-no-padding--border--offset: calc(#{pf-size-prem(2px)} * -1);

Uh oh!

Conversation

andrew-ronaldson commented Feb 11, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Feb 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related issues

Suggested reviewers

Uh oh!

patternfly-build commented Feb 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mcoker commented Feb 12, 2026

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

srambach left a comment

Choose a reason for hiding this comment

Uh oh!

mcoker left a comment

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 16, 2026

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 18, 2026

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 16, 2026

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 18, 2026

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 16, 2026

Choose a reason for hiding this comment

Uh oh!

mcoker Feb 18, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

patternfly-build commented Feb 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

andrew-ronaldson commented Feb 11, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Feb 11, 2026 •

edited

Loading

patternfly-build commented Feb 11, 2026 •

edited

Loading