Docs: Adding foundation section - Colours#220
Open
zoharma wants to merge 4 commits into
Open
Conversation
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
3 times, most recently
from
075dc35 to
73fc711
Compare
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
2 times, most recently
from
db21b01 to
710c8d5
Compare
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
from
2b42962 to
0146d8e
Compare
zoharma
changed the title
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
2 times, most recently
from
a296765 to
24963e6
Compare
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
2 times, most recently
from
a6f3e7a to
6ab5cbc
Compare
- Adding Foundation section with colours page
- Adding theme colours page
- Added views for both light and dark modes
- Adding the relevant css and ability to do so.
- Remove typography and icons (to be pushed to another PR)
- Remove :root from [data-mode="${mode}"] so that the mode can be used in any container
zoharma
force-pushed
the
zma/ds-theme-docs-foundation-colour
branch
from
6ab5cbc to
6d711b2
Compare
- Refactored the theme to remove redundant code and restore missing functionality. - Added fallback light/dark hex values for improved MUI compatibility (to support MRT) - Updated and cleaned up theme overrides to consume design tokens exclusively. - Reorganised the theme file and refreshed documentation/comments throughout. - Fixed the MuiTab &:hover rule by replacing the incorrect on-primary-container token with on-surface in the DiamondDS theme. - Removed the unused ThemeOnlyArgs type and marked the unused OutlinedInput theme parameter accordingly. - Resolved test failures and added new tests for the CSS changes. - Fixed CSS-related issues.
- Adding Foundation section with colours page
- Adding theme colours page
- Added views for both light and dark modes
- Adding the relevant css and ability to do so.
- Remove typography and icons (to be pushed to another PR)
- Remove :root from [data-mode="${mode}"] so that the mode can be used in any container
…com/DiamondLightSource/sci-react-ui into zma/ds-theme-docs-foundation-colour
NKatti2011
previously approved these changes
Jul 14, 2026
zoharma
dismissed
NKatti2011’s stale review
The merge-base changed after approval.
Collaborator
|
Just realised: For this ticket - now that data-mode is supported on any container rather than just :root, worth flagging: ThemeProvider's flicker-suppression MutationObserver on 251 only watches document.documentElement, so nested containers using their own data-mode won't get transition suppression. Is this expected/acceptable? |
Contributor
Author
|
@NKatti2011 that's a good point and it's worth exploring. The main reason for this change here is so that we can show dark mode elements in the docs in Storybook (set in light mode). There might be other usages for it in the future, for components to have their own dark/light mode settings (such as code-views and editors), but that may require further exploration. |
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
3 participants
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.
Introduced Foundation section with:
1.1 Theme Colours
Changes:
:rootfromdata-mode="{mode}"so that the mode can be used in any container