Skip to content

CSS-Library: update non-breaking space to full 4-digit unicode#1989

Merged
jamigibbs merged 2 commits intomainfrom
5350-char-encoding-css-library
Feb 13, 2026
Merged

CSS-Library: update non-breaking space to full 4-digit unicode#1989
jamigibbs merged 2 commits intomainfrom
5350-char-encoding-css-library

Conversation

@jamigibbs
Copy link
Copy Markdown
Contributor

@jamigibbs jamigibbs commented Feb 12, 2026

Chromatic

https://5350-char-encoding-css-library--65a6e2ed2314f7b8f98609d8.chromatic.com

Description

This is going to update non-breaking space unicode values from the shorthand version to the longhand version to try and remediate a seemingly random issue where Sass compiles content: '\a0' to actual UTF-8 bytes 0xC2 0xA0 in the CSS output.

When that happens, it inserts an unexpected character like this:

Screenshot 2026-02-12 at 3 35 55 PM

Functionally, nothing should change. Both \a0 and \00a0 represent the exact same character: a non-breaking space (Unicode U+00A0). The only difference is explicitness so that when the CSS compiles, it knows to only use a non-breaking space and not a visible character.

Related tickets and links

related department-of-veterans-affairs/vets-design-system-documentation#5350

Testing and review

What I'm doing to confirm that nothing stylistically has changed is that the compiled stylesheets in dist have not changed after running yarn build.

Approvals

See the QA Checklists section below for suggested approvals. Use your best judgment if additional reviews are needed. When in doubt, request a review.

Approval groups

Add approval groups to the PR as needed:

QA checklists

Use the QA checklists below as guides, not rules. Not all checklists will apply to every PR but there could be some overlap.

In all scenarios, changes should be fully tested by the author and verified by the reviewer(s); functionality, responsiveness, etc.

✨ New Component Added
  • The PR has the minor label
  • The component matches the Figma designs.
  • All properties, custom events, and utility functions have e2e and/or unit tests
  • A new Storybook page has been added for the component
  • Tested in all VA breakpoints.
  • Chromatic UI Tests have run and snapshot changes have been accepted by the design reviewer
  • Tested in vets-website using Verdaccio
  • Engineering has approved the PR
  • Design has approved the PR
  • Accessibility has approved the PR
🌱 New Component Variation Added
  • The PR has the minor label
  • The variation matches its Figma design.
  • Any new properties, custom events, or utility functions have e2e and/or unit tests
  • A new story has been added to the component's existing Storybook page
  • Any Chromatic UI snapshot changes have been accepted by a design reviewer
  • Tested in vets-website using Verdaccio
  • Engineering has approved the PR
  • Design has approved the PR
🐞 Component Fix
  • The PR has the patch label
  • Any new properties, custom events, or utility functions have e2e and/or unit tests
  • Any markup changes are evaluated for impact on vets-website.
    • Will any vets-website tests fail from the change?
  • Any Chromatic UI snapshot changes have been reviewed and approved by a designer if necessary
  • Engineering has approved the PR
♿️ Component Fix - Accessibility
  • The PR has the patch label
  • Any new properties, custom events, or utility functions have e2e and/or unit tests
  • Any Chromatic UI snapshot changes have been reviewed and approved by a designer if necessary
  • Engineering has approved the PR
  • Accessibility has approved the PR
🚨 Component Fix - Breaking API Change
  • The PR has the major label
  • vets-website and content-build have been evaluated to determine the impact of the breaking change
  • Any new properties, custom events, or utility functions have e2e and/or unit tests
  • Any Chromatic UI snapshot changes have been reviewed and approved by a designer if necessary
  • Tested in vets-website using Verdaccio
  • Engineering has approved the PR
🔧 Component Update - Non-Breaking API Change
  • The PR has the minor label
  • Any new properties, custom events, or utility functions have e2e and/or unit tests
  • Any Chromatic UI snapshot changes have been reviewed and approved by a designer if necessary
  • Engineering has approved the PR
📖 Storybook Update
  • The PR has the ignore-for-release label
  • Any Chromatic UI snapshot changes have been reviewed and approved by a designer if necessary
  • Engineering has approved the PR
🎨 CSS-Library Update
  • The PR has the css-library label
  • vets-website and content-build have been checked to determine the impact of any breaking changes
  • Engineering has approved the PR

@jamigibbs jamigibbs marked this pull request as ready for review February 12, 2026 21:49
@jamigibbs jamigibbs requested a review from a team as a code owner February 12, 2026 21:49
&::before {
background: $color-link-default-hover;
content: "\00A0";
content: "\00a0";
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

note: This one was already using the longhand version but I'm updating to lowercase for consistency.

Copy link
Copy Markdown
Contributor

@ediiotero ediiotero left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good

@jamigibbs jamigibbs merged commit 4080b14 into main Feb 13, 2026
7 checks passed
@jamigibbs jamigibbs deleted the 5350-char-encoding-css-library branch February 13, 2026 20:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants