fix(icons): update video icons to hook into contextual theme#5702
Merged
fix(icons): update video icons to hook into contextual theme#5702
Conversation
Demo
Jenkins 
demos.haus
Contributor
There was a problem hiding this comment.
Pull request overview
This PR modernizes the theming system for four video control icons (play, pause, stop, restart) to enable proper contextual theming. Previously, these icons used a deprecated selector-based approach that failed to adapt their colors when nested within elements using theme overrides. The update refactors them to use the modern vf-themed-icon mixin based on CSS custom properties, ensuring the icons properly inherit theme colors from parent contexts and provide appropriate contrast in both light and dark themes.
Key Changes:
- Refactored icon definitions to follow the three-part pattern (URL function, basic mixin, themed mixin)
- Replaced deprecated selector-based theme switching with CSS custom property-based contextual theming
- Updated dark theme color for play, pause, and stop icons from gray (#e5e5e5) to white for better contrast
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| scss/_patterns_icons.scss | Simplified icon pattern mixins to use new -themed variants |
| scss/_base_icon-definitions.scss | Added URL functions and refactored icon definitions to support contextual theming |
| package.json | Bumped version from 4.37.1 to 4.37.2 for bug fix release |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
advl
approved these changes
Dec 1, 2025
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Done
Updates some video icons (pause, play, stop, restart) to adapt to parent/contextual theme. Previously, they used an older (deprecated) theming system and did not adapt their colors when children of elements that used theme overrides (icons in light theme pages that are children of
is-darkelements, for example).Fixes #5700
Fixes WD-31531
QA
Check if PR is ready for release
If this PR contains Vanilla SCSS or macro code changes, it should contain the following changes to make sure it's ready for the release:
Feature 🎁,Breaking Change 💣,Bug 🐛,Documentation 📝,Maintenance 🔨.package.jsonshould be updated relative to the most recent release, following semver conventionScreenshots
Before
After