* Allow customer account block to center align

* Convert to using Flexbox

* Use mixins to DRY

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
This commit is contained in:
Roy Ho 2023-06-22 05:41:06 -07:00 committed by GitHub
parent ce253c24ec
commit a81a8b830d
2 changed files with 34 additions and 0 deletions

View File

@ -1,4 +1,19 @@
@import "./style";
.editor-styles-wrapper .is-layout-constrained > .wc-block-editor-customer-account.alignright {
@include flex-justify-content(flex-end);
}
.editor-styles-wrapper .is-layout-constrained > .wc-block-editor-customer-account.alignleft {
@include flex-justify-content(flex-start);
}
.editor-styles-wrapper .is-layout-constrained > .wc-block-editor-customer-account.aligncenter {
@include flex-justify-content(center);
}
.wc-block-editor-customer-account {
display: flex;
padding: em($gap-smaller) em($gap-smaller);
}

View File

@ -1,4 +1,23 @@
@mixin flex-justify-content($justification) {
float: none;
justify-content: $justification;
}
.is-layout-constrained > .wp-block-woocommerce-customer-account.alignright {
@include flex-justify-content(flex-end);
}
.is-layout-constrained > .wp-block-woocommerce-customer-account.alignleft {
@include flex-justify-content(flex-start);
}
.is-layout-constrained > .wp-block-woocommerce-customer-account.aligncenter {
@include flex-justify-content(center);
}
.wp-block-woocommerce-customer-account {
display: flex;
a {
text-decoration: none !important;
align-items: center;