Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Properly BEMify m-inset--email #8472

Merged
merged 1 commit into from
Jun 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 7 additions & 1 deletion cfgov/unprocessed/css/molecules/inset.less
Original file line number Diff line number Diff line change
Expand Up @@ -78,12 +78,18 @@
}

&--email {
// This originally was a block,
// so we override the 30px margin added by .full-width-text-group .m-inset.
margin-bottom: unit(
@grid_gutter-width * 2 / @base-font-size-px,
em
) !important;
Comment on lines +83 to +86
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.


// Tablet and above.
.respond-to-min(@bp-sm-min, {
box-sizing: border-box;
width: 50%;
padding-left: unit( @grid_gutter-width / @base-font-size-px, em );
float: right;
});
}
}
3 changes: 3 additions & 0 deletions cfgov/unprocessed/css/organisms/prefooter.less
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,9 @@
// our atomic rules.

.o-prefooter {
// Clear any floating m-inset that may be above this.
clear: both;

margin-top: unit(((@grid_gutter-width * 2) / @base-font-size-px), em);
margin-bottom: 0;

Expand Down
2 changes: 1 addition & 1 deletion cfgov/v1/jinja2/v1/includes/organisms/full-width-text.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@
{{ block | safe }}
</div>
{% elif block_type in ['email_signup'] %}
<div class="block{{ " block--flush-top" if loop.first }} m-inset--email">
<div class="m-inset m-inset--email">
<div class="o-well">
{% include_block block %}
</div>
Expand Down
Loading