Replace global js-hidden class with tabs panel modifier
#916
Conversation
This file contains 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
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-916
|
Reviewers can you confirm that this is not a breaking change please. |
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-916
36degrees
approved these changes
Jul 17, 2018
CHANGELOG.md
Outdated
| Description goes here (optional) | ||
|
|
||
| ([PR #N](https://github.com/alphagov/govuk-frontend/pull/N)) | ||
| - Replace global `js-hidden` class with tabs panel modifier |
There was a problem hiding this comment.
Just to be super clear, what about something like:
Replace conflicting
js-hiddenclass used within the tabs component with a new modifier class. Because this class is defined and used within the JavaScript, no markup changes are required.
Thoughts?
`js-hidden` is a global class that is defined by GOV.UK Template (https://github.com/alphagov/govuk_template/blob/78cbc105b564d2f4a83bb257abb98322bb851a93/source/assets/stylesheets/_accessibility.scss#L17) This could mean that if users include GOV.UK Frontend into their project it could break the JavaScript fallback in their project, since the tabs' implementation of `js-hidden` does not check for the presense of the `js-enabled` class. To avoid this problem we avoid a global class name and instead create a modifier for the panel component which is being hidden.
NickColley
force-pushed
the
fix-global-tabs-class-name
branch
from
cdf6fa3
to
896471c
Compare
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-916
NickColley
force-pushed
the
fix-global-tabs-class-name
branch
from
896471c
to
c74b1ad
Compare
Closed
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.
js-hiddenis a global class that is defined by GOV.UK Template (https://github.com/alphagov/govuk_template/blob/78cbc105b564d2f4a83bb257abb98322bb851a93/source/assets/stylesheets/_accessibility.scss#L17)This could mean that if users include GOV.UK Frontend into their project it could break the JavaScript fallback
in their project, since the tabs' implementation of
js-hiddendoes not check for the presense of thejs-enabledclass.To avoid this problem we avoid a global class name and instead create a modifier for the panel component which is being hidden.
Thankfully, since this class is only added at runtime by JavaScript, doing this is not a breaking change.