Add margin_bottom option to component wrapper helper #4494
Merged
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
andysellick
force-pushed
the
component-wrapper-margin
branch
from
5b71b81 to
3ba2107
Compare
andysellick
force-pushed
the
component-wrapper-margin
branch
from
3ba2107 to
cb1ea96
Compare
andysellick
force-pushed
the
component-wrapper-margin
branch
from
cb1ea96 to
458624c
Compare
andysellick
force-pushed
the
component-wrapper-margin
branch
2 times, most recently
from
1236093 to
bdd8464
Compare
andysellick
force-pushed
the
component-wrapper-margin
branch
from
bdd8464 to
c82b361
Compare
andysellick
force-pushed
the
component-wrapper-margin
branch
from
6ec0fd1 to
6aee663
Compare
AshGDS
approved these changes
Dec 13, 2024
docs/component-wrapper-helper.md
Outdated
| @@ -65,6 +66,9 @@ The component wrapper includes several methods to make managing options easier, | |||
| aria_attributes ||= {} | |||
| role ||= nil | |||
|
|
|||
| # margin_bottom will be applied by default, use this line to set a different default | |||
There was a problem hiding this comment.
Maybe it's worth rewording this a bit, until I read the ruby code I thought this meant that every component using the wrapper will get a margin bottom by default
There was a problem hiding this comment.
Thanks, have removed. That was a hangover from an earlier attempt at this.
andysellick
force-pushed
the
component-wrapper-margin
branch
from
6aee663 to
2ac1f9e
Compare
- add a margin_bottom option, which accepts a number from the govuk-frontend spacing scale to set margin bottom on components. Slightly tricky as it overlaps onto another option - classes - but all we have to do is check the number, generate the right class based on the number, then add it to the end of the classes as they are passed out from all_attributes - defaults to no margin and no margin class output - rewrite the component wrapper helper tests a little, firstly to make more specific, secondly to structure and group the tests a bit more logically for readability - update a trio of components that were broken by these changes, by removing their use of the shared helper for this same functionality and updating tests accordingly
- switch any components using the shared_helper for margin_bottom, that also use the component wrapper helper, to not use the shared_helper for margin_bottom - note that some components still use the shared_helper for margin_bottom, but aren't using the component wrapper helper yet, so can't be switched
andysellick
force-pushed
the
component-wrapper-margin
branch
from
2ac1f9e to
bfad545
Compare
Merged
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.
What
Adds a
margin_bottomoption to the component wrapper helper, effectively copying it out of the shared_helper.I wanted to write a new set of classes here for margins to stop using the govuk-frontend margin override classes, because they should only be used where an override is necessary (they use
!important). However right out the gate it turns out we do need the override classes - just to override the default margin applied to some of the govuk-frontend components (details, for example, where we want a 15px margin and the component comes with 30px by default).Supercedes #4470
Why
The CW helper seems like the more logical home for this option, rather than the shared helper. Additionally, cleaning up and standardising this will help us make component spacing more consistent later.
I'd remove the shared_helper margin option entirely but other parts of our code are using it, so it seems better to roll out this addition, switch, then remove it from the shared_helper later.
Visual Changes
Hopefully none.
Trello card: https://trello.com/c/Y0pDWbHw/242-move-some-shared-helper-options-into-component-wrapper