Use placeholders when @extend'ing in prose scope #550
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.
This updates the prose scope (and the things the prose scope depends on) such that we only ever @extend placeholder selectors.
This abstraction gives us control over which occurrences of the selector are included by the @extend. Without this change, occurrences of e.g. the heading classes within the fieldset component are also ending up being ‘applied’ to the prose scope, leading to selectors like
.govuk-c-fieldset__legend .govuk-prose-scope h4
in the CSS. This makes no sense, as the prose scope should never be used within the fieldset legend.With this change, only occurrences of the placeholder selectors are 'included' when @extend’ing. This means that as we define e.g. the typographic contextual adjustments at the placeholder level and these will be applied to the prose scope, but other references to the concrete classes will have no effect on the prose scope.
It also changes the linting rules to enforce that
@extends
can only be used to extend placeholder classes.Difference in generated CSS
Reversal of simple selectors in compound .govuk-link / attribute selectors:
Change in whitespace around selectors:
Addition of
.govuk-prose-scope
hr here now that it extends%govuk-section-break
:Re-ordering of selectors:
Removal of non-sensical prose scope adjustments for fieldset component 🎉: