Accessibility options added and Purge css implemented#2573
Open
sazedul-haque wants to merge 28 commits into4.0.0-devfrom
Open
Accessibility options added and Purge css implemented#2573sazedul-haque wants to merge 28 commits into4.0.0-devfrom
sazedul-haque wants to merge 28 commits into4.0.0-devfrom
Conversation
Introduce a central utility generation config and gate responsive utility output to reduce CSS build size. Adds assets/core/scss/tokens/_utility-config.scss (forwarded from tokens index) which exposes responsive breakpoint/spacing/radius maps and toggles ($tutor-enable-responsive-*) to control which utility groups are generated. Update utilities (borders, colors, layout, sizing, spacing, typography) to use the new responsive maps and flags, restrict generated variants (smaller spacing/radius subsets, limited border directions, optional responsive colors, etc.), and wrap responsive blocks in @if checks. Also simplify package.json "build-dev" script to just run rspack --mode=production. Overall goal: make responsive utility generation configurable and shrink output by default.
Broaden theme attribute matching to starts-with ([data-tutor-theme^="dark"/"light"]) and add new icon and action tokens. Introduces --tutor-icon-*-secondary and --tutor-actions-*-exception CSS variables in theme files, exposes corresponding SCSS variables ($tutor-icon-*, $tutor-actions-*) and includes them in the $tutor-icons and $tutor-actions maps so callers can use secondary and exception variants.
Add new accessibility theme variants (light/dark): high-contrast, protanopia, deuteranopia, and deuteranomaly, each providing CSS custom properties tuned for those needs (swapping success/green to cyan and error/red to orange where appropriate). Update themes/_index.scss to forward the new theme files. Add cyan and orange color palettes and corresponding color maps to tokens/_colors.scss to support the new themes.
Remove the conditional feature flags and always generate responsive utility classes. Added spacing tokens (7 and 9) to $tutor-responsive-spacing. Unwrapped @if guards across utilities (_borders.scss, _layout.scss, _sizing.scss, _spacing.scss, _typography.scss) so responsive classes are emitted for all breakpoints. Removed the gated responsive color utilities block and performed small formatting/cleanup in the borders utilities.
Normalize the @forward import strings in assets/core/scss/tokens/_index.scss from double quotes to single quotes for consistent code style. This is a formatting-only change and does not affect runtime behavior.
Add @fullhuman/postcss-purgecss, postcss, and postcss-loader devDependencies and enable PurgeCSS in rspack build. Import and configure PurgeCSS in rspack.config.mjs with content paths, extractor, and a comprehensive safelist/regex to avoid removing Tutor utilities and component classes; only run PurgeCSS in non-development mode. Factor out reusable css-loader and sass-loader configs, move URL font filtering into css-loader, and split the .scss rule so core SCSS (assets/core/scss) is processed with postcss-loader+PurgeCSS while other SCSS files use the simpler loader chain.
Introduce high-contrast CSS variable overrides for multiple colorblind theme variants to improve accessibility. Generalize the dark/light high-contrast selectors ([data-tutor-theme^="dark"][data-tutor-contrast="high"] and [data-tutor-theme^="light"][data-tutor-contrast="high"]) and add specific [data-tutor-theme="*-deuteranomaly|deuteranopia|protanopia"][data-tutor-contrast="high"] blocks that set success, button, border, and action variables (cyan/yellow/orange adjustments). Affected files: _dark-deuteranomaly.scss, _dark-deuteranopia.scss, _dark-protanopia.scss, _light-deuteranomaly.scss, _light-deuteranopia.scss, _light-protanopia.scss, and the dark/light high-contrast base files.
b-l-i-n-d
requested changes
Apr 16, 2026
Collaborator
There was a problem hiding this comment.
Use data-tutor-vision to override the tokens.
Collaborator
There was a problem hiding this comment.
Kindly review the file, as some functions may require adjustments following the resolution of the previous comments.
Collaborator
There was a problem hiding this comment.
I kindly request that you compress the text using svgomg.net, while ensuring that the "remove viewBox" option remains disabled.
b-l-i-n-d
reviewed
Apr 16, 2026
Collaborator
b-l-i-n-d
left a comment
b-l-i-n-d
left a comment
There was a problem hiding this comment.
There is no implementation for reduced motion.
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
2 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.
No description provided.