Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updates to spacing tokens, table headers, breadcrumb and badge components #84

Open
wants to merge 6 commits into
base: staging
Choose a base branch
from

Conversation

davyd-akamai
Copy link
Collaborator

@davyd-akamai davyd-akamai commented Jan 27, 2025

  1. Breadcrumb text and icon tokens now have a default, hover and active states:
  • Text token was split into text.default, text.hover and text.active tokens;
  • Icon token was split into icon.default and icon.hover tokens in a collapse and withDropdown variant;
  • Default variant of a breadcrumb was renamed to normal to avoid duplications with a text property;
  1. Updates to spacing tokens.

Rem values were replaced with px values.
All spacing tokens were renamed and now contain prefix 's' and it's value number inside of the name:

  • Spacing token 0 now is s0 (0px);
  • Spacing token 10 now is s2 (2px);
  • Spacing token 20 now is s4 (4px);
  • Spacing token 30 now is s6 (6px);
  • Spacing token 40 now is s8 (8px);
  • Spacing token 50 now is s12 (12px);
  • Spacing token 60 now is s16 (16px);
  • Spacing token 70 now is s24 (24px);
  • Spacing token 80 now is s32 (32px);
  • Spacing token 90 now is s48 (48px);

Introduced new spacing tokens:

  • Spacing token s20 (20px);
  • Spacing token s28 (28px);
  • Spacing token s36 (36px);
  • Spacing token s40 (40px);
  • Spacing token s64 (64px);
  • Spacing token s72 (72px);
  • Spacing token s96 (96px);
  1. Updates to table headers:
  • The background token in the headerFilled variant now uses the alias.background.neutralSubtle token;
  • Text and icon now use the alias.content.text.primary and alias.content.icon.primary tokens, respectively;
  • A new border token has been introduced for the headerFilled and headerNested variants, using the alias.border.neutral token;
  1. Other changes:
  • The alias.border.neutral token is now connected to the global.neutral.50 global token in both modes;
  • The statusIcon token in the secondary notification banner now uses the alias.content.icon.secondary.default token;
  • A new badge group type accent has been introduced;
  • A Multi-select feature for Segmented buttons has been introduced;
  • The old badge styles have been moved under the subtle group;
  • The tokens collection has been renamed from CDS to Core;

@davyd-akamai davyd-akamai self-assigned this Jan 27, 2025
@davyd-akamai davyd-akamai changed the title Updates to spacing tokens, breadcrumb component Updates to spacing tokens, table headers, breadcrumb and badge components Jan 28, 2025
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.

2 participants