Seedlet: Fix layout grid margins (#2219)
* Add padding to children of layout grid block columns. * Fix margins on columns inserter. * Round IE calc values.
This commit is contained in:
Jeff Ong
GitHub
parent
a52a6aa758
commit
283b23fd16
7 changed files with 180 additions and 88 deletions
|
|
@ -1142,32 +1142,32 @@ hr.wp-block-separator.is-style-wide {
|
|||
* - Sets spacing-vertical margin logic
|
||||
*/
|
||||
.site-footer > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.site-main > article > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.site-main > .not-found > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.entry-content > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
[class*="inner-container"] > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.widget-area > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.widget-column > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -1410,59 +1410,59 @@ input[type="submit"]:after,
|
|||
}
|
||||
|
||||
button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
input[type="submit"]:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-button__link:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-file .wp-block-file__button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.a8c-posts-list__view-all:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button[data-load-more-btn]:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
input[type="submit"]:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-button__link:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-file .wp-block-file__button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.a8c-posts-list__view-all:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button[data-load-more-btn]:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button:active {
|
||||
|
|
@ -2446,8 +2446,8 @@ object {
|
|||
}
|
||||
|
||||
.wp-block-columns .wp-block-column > * {
|
||||
margin-top: 19.8px;
|
||||
margin-bottom: 19.8px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -2470,7 +2470,7 @@ object {
|
|||
}
|
||||
|
||||
.wp-block-columns .wp-block-column:not(:last-child) {
|
||||
margin-bottom: 19.8px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -2620,13 +2620,13 @@ object {
|
|||
}
|
||||
|
||||
.wp-block-cover .wp-block-cover__inner-container > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.wp-block-cover-image .wp-block-cover__inner-container > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -2716,7 +2716,7 @@ object {
|
|||
|
||||
.wp-block-file .wp-block-file__button {
|
||||
display: inline-block;
|
||||
padding: 11.5px 12.5px;
|
||||
padding: 12px 13px;
|
||||
}
|
||||
|
||||
.wp-block-gallery {
|
||||
|
|
@ -2755,8 +2755,8 @@ object {
|
|||
}
|
||||
|
||||
.wp-block-group .wp-block-group__inner-container > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -2775,7 +2775,7 @@ object {
|
|||
}
|
||||
|
||||
.wp-block-group.has-background {
|
||||
padding: 19.98px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -3248,8 +3248,8 @@ dd {
|
|||
}
|
||||
|
||||
.wp-block-media-text .wp-block-media-text__content > * {
|
||||
margin-top: 19.98px;
|
||||
margin-bottom: 19.98px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -3283,7 +3283,7 @@ dd {
|
|||
}
|
||||
|
||||
.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
|
||||
padding: 13.2px;
|
||||
padding: 13px;
|
||||
}
|
||||
|
||||
.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
|
||||
|
|
@ -3303,7 +3303,7 @@ dd {
|
|||
.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container {
|
||||
border: none;
|
||||
left: 0;
|
||||
margin-left: 13.2px;
|
||||
margin-left: 13px;
|
||||
min-width: max-content;
|
||||
opacity: 0;
|
||||
padding: 0;
|
||||
|
|
@ -3313,7 +3313,7 @@ dd {
|
|||
|
||||
.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
|
||||
display: inline-block;
|
||||
padding: 6.6px 13.2px;
|
||||
padding: 7px 13px;
|
||||
}
|
||||
|
||||
.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon {
|
||||
|
|
@ -3372,7 +3372,7 @@ p.has-background {
|
|||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
padding: 10px 13.2px;
|
||||
padding: 10px 13px;
|
||||
}
|
||||
|
||||
.a8c-posts-list__item {
|
||||
|
|
@ -3783,7 +3783,7 @@ p.has-background {
|
|||
color: #333333;
|
||||
line-height: 1.7;
|
||||
max-width: inherit;
|
||||
margin-right: 16.5px;
|
||||
margin-right: 17px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
|
|
@ -4691,16 +4691,16 @@ nav a {
|
|||
width: 0;
|
||||
}
|
||||
.primary-navigation > div > ul > li > a:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
.woo-navigation > div > ul > li > a:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
.primary-navigation > div > ul > li > a:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
.woo-navigation > div > ul > li > a:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -4787,7 +4787,7 @@ nav a {
|
|||
font-family: 'Playfair Display', Georgia, Times, serif;
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
padding: 6.6px 0;
|
||||
padding: 7px 0;
|
||||
}
|
||||
|
||||
.woo-navigation a {
|
||||
|
|
@ -4796,7 +4796,7 @@ nav a {
|
|||
font-family: 'Playfair Display', Georgia, Times, serif;
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
padding: 6.6px 0;
|
||||
padding: 7px 0;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -4804,13 +4804,13 @@ nav a {
|
|||
font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding: 13.2px;
|
||||
padding: 13px;
|
||||
}
|
||||
.woo-navigation a {
|
||||
font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding: 13.2px;
|
||||
padding: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -4828,26 +4828,26 @@ nav a {
|
|||
|
||||
.primary-navigation .sub-menu {
|
||||
list-style: none;
|
||||
margin-left: 13.2px;
|
||||
margin-left: 13px;
|
||||
}
|
||||
|
||||
.woo-navigation .sub-menu {
|
||||
list-style: none;
|
||||
margin-left: 13.2px;
|
||||
margin-left: 13px;
|
||||
}
|
||||
|
||||
.primary-navigation .sub-menu .menu-item a {
|
||||
font-size: 24px;
|
||||
font-style: italic;
|
||||
padding-top: 6.6px;
|
||||
padding-bottom: 6.6px;
|
||||
padding-top: 7px;
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
|
||||
.woo-navigation .sub-menu .menu-item a {
|
||||
font-size: 24px;
|
||||
font-style: italic;
|
||||
padding-top: 6.6px;
|
||||
padding-bottom: 6.6px;
|
||||
padding-top: 7px;
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
|
|
@ -4874,12 +4874,12 @@ nav a {
|
|||
.primary-navigation .menu-item-has-children > .svg-icon {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
margin-right: 13.2px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
.woo-navigation .menu-item-has-children > .svg-icon {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
margin-right: 13.2px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -4912,7 +4912,7 @@ nav a {
|
|||
}
|
||||
|
||||
.social-navigation > div > ul > li {
|
||||
margin-bottom: 13.2px;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
.social-navigation > div > ul > li:first-of-type > a {
|
||||
|
|
@ -4926,7 +4926,7 @@ nav a {
|
|||
.social-navigation a {
|
||||
color: #333333;
|
||||
display: inline-block;
|
||||
padding: 0 6.6px;
|
||||
padding: 0 7px;
|
||||
}
|
||||
|
||||
.social-navigation a:hover {
|
||||
|
|
@ -5038,7 +5038,7 @@ nav a {
|
|||
font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding: 13.2px;
|
||||
padding: 13px;
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
|
|
@ -5382,8 +5382,8 @@ nav a {
|
|||
font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
margin-left: 13.2px;
|
||||
margin-right: 13.2px;
|
||||
margin-left: 13px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
|
||||
.pagination .nav-links > *.current {
|
||||
|
|
@ -5495,7 +5495,7 @@ nav a {
|
|||
.comment-meta .comment-author {
|
||||
line-height: 1.3;
|
||||
margin-bottom: 5px;
|
||||
padding-right: 62.5px;
|
||||
padding-right: 63px;
|
||||
max-width: calc(100% - 75px);
|
||||
}
|
||||
|
||||
|
|
@ -5759,7 +5759,7 @@ nav a {
|
|||
|
||||
@media only screen and (min-width: 482px) {
|
||||
.comment-form > p.comment-form-author {
|
||||
margin-right: 37.5px;
|
||||
margin-right: 38px;
|
||||
}
|
||||
.comment-form > p.comment-notes, .comment-form > p.logged-in-as {
|
||||
display: block;
|
||||
|
|
@ -5843,7 +5843,7 @@ img#wpstats {
|
|||
font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
padding: 5px 6.6px;
|
||||
padding: 5px 7px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
|
|
@ -6325,59 +6325,59 @@ input[type="submit"]:after,
|
|||
}
|
||||
|
||||
button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
input[type="submit"]:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-button__link:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-file .wp-block-file__button:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.a8c-posts-list__view-all:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button[data-load-more-btn]:before {
|
||||
margin-bottom: -calc(0.5em + -0.38);
|
||||
margin-bottom: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
input[type="submit"]:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-button__link:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.wp-block-file .wp-block-file__button:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
.a8c-posts-list__view-all:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button[data-load-more-btn]:after {
|
||||
margin-top: -calc(0.5em + -0.39);
|
||||
margin-top: -calc(1em + 0);
|
||||
}
|
||||
|
||||
button:active {
|
||||
|
|
@ -6565,6 +6565,26 @@ button[data-load-more-btn],
|
|||
padding-right: 20px !important;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Gutter Options */
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
|
||||
grid-gap: 0px !important;
|
||||
|
|
|
|||
|
|
@ -1548,9 +1548,10 @@ pre.wp-block-verse {
|
|||
padding-left: calc(var(--layout-grid--gutter-huge) + var(--layout-grid--background-offset));
|
||||
}
|
||||
|
||||
/* Overlay grid */
|
||||
/* Overlay styles and margin reset */
|
||||
.wp-block-jetpack-layout-grid {
|
||||
/* wpcom-overlay-grid is the classname targeting the grid overlay visual aid displayed in the editor */
|
||||
/* Override default block margin rules */
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wpcom-overlay-grid {
|
||||
|
|
@ -1564,6 +1565,11 @@ pre.wp-block-verse {
|
|||
padding-right: 0;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid [data-type="jetpack/layout-grid-column"] {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid.wp-block-jetpack-layout-gutter__none .wpcom-overlay-grid {
|
||||
grid-gap: var(--layout-grid--gutter-none);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* Overlay grid */
|
||||
/* Overlay styles and margin reset */
|
||||
.wp-block-jetpack-layout-grid {
|
||||
/* wpcom-overlay-grid is the classname targeting the grid overlay visual aid displayed in the editor */
|
||||
.wpcom-overlay-grid {
|
||||
|
|
@ -84,6 +84,12 @@
|
|||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Override default block margin rules */
|
||||
[data-type="jetpack/layout-grid-column"] {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@each $size in $layout-gutter-sizes {
|
||||
|
|
|
|||
|
|
@ -17,12 +17,30 @@
|
|||
padding-left: var(--layout-grid--background-offset) !important;
|
||||
padding-right: var(--layout-grid--background-offset) !important;
|
||||
}
|
||||
|
||||
> * {
|
||||
margin-top: calc( 0.666 * var(--global--spacing-vertical) );
|
||||
margin-bottom: calc( 0.666 * var(--global--spacing-vertical) );
|
||||
|
||||
@include media(mobile) {
|
||||
margin-top: var(--global--spacing-vertical);
|
||||
margin-bottom: var(--global--spacing-vertical);
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Gutter Options */
|
||||
@each $size in $layout-gutter-sizes {
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__#{$size} {
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__#{$size} {
|
||||
grid-gap: var(--layout-grid--gutter-#{$size}) !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@ module.exports = {
|
|||
"preserve": false,
|
||||
"preserveAtRulesOrder": true
|
||||
}),
|
||||
require( 'postcss-calc' )
|
||||
require( 'postcss-calc' )({
|
||||
"precision": 0
|
||||
})
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4286,6 +4286,26 @@ button[data-load-more-btn],
|
|||
padding-left: var(--layout-grid--background-offset) !important;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: calc( 0.666 * var(--global--spacing-vertical));
|
||||
margin-bottom: calc( 0.666 * var(--global--spacing-vertical));
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: var(--global--spacing-vertical);
|
||||
margin-bottom: var(--global--spacing-vertical);
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Gutter Options */
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
|
||||
grid-gap: var(--layout-grid--gutter-none) !important;
|
||||
|
|
|
|||
|
|
@ -4312,6 +4312,26 @@ button[data-load-more-btn],
|
|||
padding-right: var(--layout-grid--background-offset) !important;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: calc( 0.666 * var(--global--spacing-vertical));
|
||||
margin-bottom: calc( 0.666 * var(--global--spacing-vertical));
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 482px) {
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
|
||||
margin-top: var(--global--spacing-vertical);
|
||||
margin-bottom: var(--global--spacing-vertical);
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Gutter Options */
|
||||
.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
|
||||
grid-gap: var(--layout-grid--gutter-none) !important;
|
||||
|
|
|
|||
Loading…
Reference in a new issue