Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Dec 5, 2025

Proposed changes

Applies CustomSelect component styling to native <select> elements using the new CSS ::picker(select) pseudo-element for consistent design system appearance across custom and native implementations.

Changes

  • ::picker(select) styling: Adapted positioning, z-index, shadows, sizing, overflow, and max-height from .db-custom-select-dropdown and .db-custom-select-list
  • option element styling: Applied padding, backgrounds, border-radius, hover/active states, and checked font-weight from .db-custom-select-list-item
  • Added @use helpers import for hover/active mixins

Styling activates within @supports (appearance: base-select) block, ensuring progressive enhancement.

resolves #3654

Types of changes

  • Bugfix (non-breaking change that fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Refactoring (improvements to existing components or architectural decisions)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation Update (if none of the other choices apply)

Further comments

The native select picker now inherits design system styling (elevation, spacing, interactive states) matching the custom select component when browsers support appearance: base-select. Falls back to default browser styling otherwise.

❤️ Thank you!


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

🔭🐙🐈 Test this branch here: https://design-system.deutschebahn.com/core-web/review/copilot/sub-pr-4624

@changeset-bot
Copy link

changeset-bot bot commented Dec 5, 2025

⚠️ No Changeset found

Latest commit: 2ce6e69

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

GitHub Copilot and others added 3 commits December 5, 2025 18:43
Co-authored-by: mfranzke <787658+mfranzke@users.noreply.github.com>
Co-authored-by: mfranzke <787658+mfranzke@users.noreply.github.com>
Co-authored-by: mfranzke <787658+mfranzke@users.noreply.github.com>
Copilot AI changed the title [WIP] Add native select styling changes feat: adapt CustomSelect styles to native select ::picker pseudo-element Dec 5, 2025
Copilot AI requested a review from mfranzke December 5, 2025 18:48
Copilot finished work on behalf of mfranzke December 5, 2025 18:48
@mfranzke mfranzke marked this pull request as ready for review December 5, 2025 21:38
@mfranzke mfranzke merged commit 0b9982f into feat-multi-select-native-select-styling-new Dec 5, 2025
104 of 109 checks passed
@mfranzke mfranzke deleted the copilot/sub-pr-4624 branch December 5, 2025 21:38
@github-project-automation github-project-automation bot moved this from 🏗 In progress to ✅ Done in UX Engineering Team Backlog Dec 5, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: ✅ Done

Development

Successfully merging this pull request may close these issues.

2 participants