Skip to content

fix: Reduce range units #5300

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.

Sign up for GitHub

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

Jump to bottom
Closed
wants to merge 4 commits into from
Closed

fix: Reduce range units #5300

wants to merge 4 commits into from

Conversation

mohitfrontenddev
Copy link

Description

Reduce the amount of range units in animation ui #5253
image

This PR reduces the allowed CSS units in RANGE_UNITS to only ["px", "em", "rem", "vw", "vh"] to simplify the UI and improve UX.

Steps for reproduction

  1. Go to the animation panel.
  2. Try selecting units in range fields.
  3. Only %, px, em, rem, vw, vh should appear.

Code Review

  • hi @kof, I need you to do
    • conceptual review (architecture, feature-correctness)
    • detailed review (read every line)
    • test it on preview

Before requesting a review

  • made a self-review
  • added inline comments where things may be not obvious (the "why", not "what")

Before merging

  • tested locally and on preview environment (preview dev login: 0000)
  • updated test cases document
  • added tests
  • if any new env variables are added, added them to .env file

TrySound
TrySound reviewed Jun 27, 2025
View reviewed changes
packages/css-data/bin/mdn-data.ts Outdated
// consider % as unit
percentage: ["%"],
...data.units,
length: ["%", "px", "em", "rem", "vw", "vh"],
Copy link
Member

Choose a reason for hiding this comment

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

The issue is specifically about range units. This change will prevent using modern units in all style properties.

TrySound
TrySound reviewed Jun 27, 2025
View reviewed changes
packages/sdk/src/schema/animation-schema.ts Outdated
"lvmax",
"dvmax",
] as const;
export const RANGE_UNITS = ["%", "px", "em", "rem", "vw", "vh"] as const;
Copy link
Member

Choose a reason for hiding this comment

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

Maybe leave only % and px

Copy link
Author

Choose a reason for hiding this comment

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

I have updated the branch as per your feedback (limited RANGE_UNITS to % and px). Please review.

@mohitfrontenddev mohitfrontenddev changed the title Reduce range units fix: Reduce range units Jun 27, 2025
@mohitfrontenddev mohitfrontenddev closed this by deleting the head repository Aug 5, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@TrySound TrySound TrySound left review comments

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@mohitfrontenddev @TrySound