Skip to content

Conversation

OstafinL
Copy link
Contributor

@OstafinL OstafinL commented Oct 9, 2025

🎫 Issue IBX-10648

Description:

The select element referenced in the ticket is a native HTML select, which does not support styling with ::after or ::before pseudo-elements.Therefore, creating a custom arrow using these CSS features is not possible.

Using an SVG from our icon library (admin-ui) was also not an option because arrow form our icons library is too heavy for this context.

To achieve a lightweight, visually appropriate arrow, I used a custom inline SVG as a background image. This approach ensures cross-browser compatibility (including Safari) and allows for precise control over the arrow’s appearance without relying on pseudo-elements or external assets.

Safari:
Screenshot 2025-10-09 at 11 18 32

For QA:

Documentation:

@OstafinL OstafinL requested a review from a team October 9, 2025 09:08
@ezrobot ezrobot requested review from GrabowskiM, RopRaptor, albozek, alekmick, dew326 and tischsoic and removed request for a team October 9, 2025 09:08
@OstafinL OstafinL force-pushed the IBX-10648-flatpicrk-has-default-select-on-safari branch from d41aad8 to e4a9df8 Compare October 9, 2025 09:11
Copy link

sonarqubecloud bot commented Oct 9, 2025

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