Fix visually hidden style not taking effect, allow KTextbox label to be visually hidden #1169
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.
Description
Fixes internal visually hidden style (
KCardexample here + here) not taking effect in KDS components when used from an applicationAs a side effect, above also exposes the
.visuallyhiddenclass to be used for any component, not just KDS.Allows
KTextboxlabel to be passed via slot and adds documentation on how to achieve visually hidden labelAlso has few maintenance commits for related documentation and test suite
Issue addressed
Steps to test
Changelog
Description: Fixes internal visually hidden style not taking effect in KDS components, and exposes the
.visuallyhiddenclass as publicProducts impact: bugfix
Addresses: Investigate why visuallyhidden class doesn't take effect in Studio #1163
Components: -
Breaking: no
Impacts a11y: no
Guidance: Import KDS styles in the main application stylesheet with
@import '~kolibri-design-system/lib/styles/common';as described in https://design-system.learningequality.org/installation#register-global-styles. Cleanup custom.visuallyhiddenclass from application styles. See https://design-system.learningequality.org/#helper-styles.Description: Allows
KTextboxlabel to be passed via slotProducts impact: new API
Addresses: [KTextbox]: Allow label to be passed via slot #1166
Components:
KTextboxBreaking: no
Impacts a11y: yes
Guidance: -