From 50a705a443e4915986aef5f19c1bf2b5e432498a Mon Sep 17 00:00:00 2001 From: Jb Audras Date: Fri, 7 Oct 2022 20:40:31 +0000 Subject: [PATCH] Twenty Twenty: Improve Separator Block rendering. This changeset fixes inconsistent alignment behavior of the Separator Block in the editor. Props kmadhak, sabernhardt, mukesh27, nidhidhandhukiya, kajalgohel. Fixes #55910. git-svn-id: https://develop.svn.wordpress.org/trunk@54418 602fd350-edb4-49c9-b593-d223f7449a82 --- .../twentytwenty/assets/css/editor-style-block-rtl.css | 7 +++++-- .../themes/twentytwenty/assets/css/editor-style-block.css | 7 +++++-- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css b/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css index 494aa8243e..063075bf1a 100644 --- a/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css +++ b/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css @@ -619,12 +619,15 @@ hr.wp-block-separator:not(.is-style-dots)::after { width: 1px; } -hr.wp-block-separator::before { +.editor-styles-wrapper hr.wp-block-separator::before { right: calc(50% - 5px); + left: auto; } -hr.wp-block-separator::after { +.editor-styles-wrapper hr.wp-block-separator::after { left: calc(50% - 5px); + right: auto; + border-radius: 0; } /* STYLE: DOTS */ diff --git a/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css b/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css index 352a59f399..8b62985520 100644 --- a/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css +++ b/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css @@ -623,12 +623,15 @@ hr.wp-block-separator:not(.is-style-dots)::after { width: 1px; } -hr.wp-block-separator::before { +.editor-styles-wrapper hr.wp-block-separator::before { left: calc(50% - 5px); + right: auto; } -hr.wp-block-separator::after { +.editor-styles-wrapper hr.wp-block-separator::after { right: calc(50% - 5px); + left: auto; + border-radius: 0; } /* STYLE: DOTS */