From e2ccc37f5f7fa2a6bcc939b369f54766b0a3a1ad Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Thu, 16 Apr 2020 11:30:26 +0100 Subject: [PATCH] Fix buttons styling for old markup --- packages/block-library/src/button/style.scss | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/button/style.scss b/packages/block-library/src/button/style.scss index 69c651422c517..40f44b71ace52 100644 --- a/packages/block-library/src/button/style.scss +++ b/packages/block-library/src/button/style.scss @@ -1,6 +1,8 @@ $blocks-button__height: 56px; -.wp-block-button { +// Prefer the link selector instead of the regular button classname +// to support the previous markup in addition to the new one. +.wp-block-button__link { color: $white; background-color: $dark-gray-700; border: none; @@ -32,15 +34,22 @@ $blocks-button__height: 56px; } } -.wp-block-button.is-style-squared { +// the first selector is required for old buttons markup +.wp-block-button.is-style-squared, +.wp-block-button__link.wp-block-button.is-style-squared { border-radius: 0; } -.wp-block-button.no-border-radius { + +// the first selector is required for old buttons markup + +.wp-block-button.no-border-radius, +.wp-block-button__link.wp-block-button.no-border-radius { border-radius: 0 !important; } -.wp-block-button.is-style-outline { +.wp-block-button.is-style-outline, +.wp-block-button__link.is-style-outline { color: $dark-gray-700; background-color: transparent; border: 2px solid;