Skip to content

Conversation

@Jura
Copy link
Member

@Jura Jura commented Oct 24, 2025

No description provided.

Jura and others added 4 commits October 20, 2025 11:37
…lue names (#1611)

* Initial plan

* Initial plan for spacing utility classes

Co-authored-by: Jura <[email protected]>

* Add spacing utility classes with ranking and pixel values

Co-authored-by: Jura <[email protected]>

* Add collapsible margins to all spacing utility classes

Co-authored-by: Jura <[email protected]>

* Add spacing utility classes for values 36-400 with one selector per rule

Co-authored-by: Jura <[email protected]>

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: Jura <[email protected]>
* Initial plan

* Add missing input type styles and stories for all HTML5 input types

Co-authored-by: Jura <[email protected]>

* Update input labels to reflect type and add spacing between fields in docs

Co-authored-by: Jura <[email protected]>

* Change Datetime-local label to 'Local date and time' and remove border for File input

Co-authored-by: Jura <[email protected]>

* Implement custom range input design with states (default, focus, hover, disabled)

Co-authored-by: theadamparker <[email protected]>

* Update range input styling to match Figma design spec

- Increased track height from 4px to 8px per design
- Updated track border-radius to 25px for pill shape
- Redesigned thumb with white background and 4px blue border
- Added progress fill visualization using CSS gradients and custom properties
- Implemented focus state with blue shadow around track
- Updated hover state to use blue-700 color (#1F5A95)
- Updated disabled state with gray-500 fill (#A9B1B7)
- Added JavaScript logic to dynamically update --range-progress CSS variable
- Improved cross-browser support for webkit and mozilla

Design reference: https://www.figma.com/design/SfhWL6TIltXuwKoprfKafj/1606-add-range-input?node-id=34-90

* fix: remove black border from input[type='range'] and resolve SCSS syntax error

* fix: resolve SCSS syntax error and update range input knob to blue center

* #1606 - updated production assets

* feat: update range input knob to solid blue (border and center)

- Changed knob border from white to blue (var(--undpds-color-blue-600))
- Knob is now fully blue in default state
- Hover state: darker blue (var(--undpds-color-blue-700))
- Disabled state: gray (var(--undpds-color-gray-500))
- Includes compiled CSS assets in docs folder

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: Jura <[email protected]>
Co-authored-by: theadamparker <[email protected]>
Co-authored-by: Jura Khrapunov <[email protected]>
…1614)

* Initial plan

* Fix input field text color in error state to be black

Co-authored-by: Jura <[email protected]>

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: Jura <[email protected]>
@cloudflare-workers-and-pages
Copy link

Deploying design-system with  Cloudflare Pages  Cloudflare Pages

Latest commit: e7cd324
Status: ✅  Deploy successful!
Preview URL: https://3bf7f280.design-system.pages.dev
Branch Preview URL: https://develop.design-system.pages.dev

View logs

@Jura Jura merged commit d967993 into master Oct 24, 2025
4 checks passed
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