INN / umbrella-inndev

Umbrella repository for inn.org
GNU General Public License v2.0
0 stars 1 forks source link

Add margin to full-width block columns #159

Closed kaylima closed 4 years ago

kaylima commented 4 years ago

this can be added across the board... I think? But definitely add different id if needed.

Goal = make the images that are full-width on the rust to resilience page have some spacing.. right now are up against the edges on left and right.

wp-block-columns { margin: 30px; }

benlk commented 4 years ago

Three-column gutter is 32px, so for matching whitespace we'd need

.alignfull .wp-block-columns {
    padding: 0 20px;
}

The layout on this page is Image blocks in Columns in an alignfull Group block.

benlk commented 4 years ago

Screen Shot 2020-04-29 at 19 13 28

Prevent inter-column additional whitespace on mobile:

@min-width ( 781px ) { 
.alignfull .wp-block-columns {
    margin-bottom: 32px;
    margin-top: 32px;
}
}
.alignfull .wp-block-columns {
    margin-left: 32px;
    margin-right: 32px;
}
benlk commented 4 years ago

That CSS change ☝️ is small enough to temporarily insert via the Customizer, but I can get a PR for it tonight if desired.

Would we want to deploy this alongside the frontend tweaks for Give https://github.com/INN/inn/pull/128 or is this an entirely separate matter?

benlk commented 4 years ago

Now :deployed: with https://github.com/INN/umbrella-inndev/commit/0928f09592d4f90dc6ff6926b90550051ad8c4e2