Properly BEMify m-inset--email
#8472
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
anselmbradford
commented
Jun 13, 2024
Comment on lines
+83
to
+86
| margin-bottom: unit( | ||
| @grid_gutter-width * 2 / @base-font-size-px, | ||
| em | ||
| ) !important; |
There was a problem hiding this comment.
We could probably delete this, since regular m-insets don't have it, but I added it for now to retain the spacing at mobile.
anselmbradford
force-pushed
the
ans_remove_inset_left
branch
from
a5ea8a8
to
4d432bd
Compare
csebianlander
approved these changes
Jun 17, 2024
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.
Changes
m-insetto accompany orphanm-inset--emailm-inset--emailto mimic block spacing.float: rightonm-inset--email, since that's already set onm-inset.o-prefooter, to clear any floats above the prefooter.How to test this PR
?q=m-inset--email&search_type=html. For example:http://localhost:8000/compliance/compliance-resources/mortgage-resources/loan-origination-rule/
http://localhost:8000/compliance/compliance-resources/signup/
http://localhost:8000/compliance/compliance-resources/consumer-cards-resources/credit-card-penalty-fees/
In some cases, the inset is below the heading because of the top margin of the block that was there, so in this PR the inset moves up to be in line with the heading. This seems acceptable, since some of the pages have insets that are already aligned with their associated section heading, so this makes it more consistent.
Screenshots
Before:
After:
Before:
After:
Before:
After (this one gets kind of a gap now. The page should probably be edited in Wagtail to move the inset up):
https://www.consumerfinance.gov/compliance/compliance-resources/other-applicable-requirements/annual-percentage-rate-tables/