diff --git a/_inc/client/components/global-notices/style.scss b/_inc/client/components/global-notices/style.scss index 71b0e3ec616c..6ebc17cb1f65 100644 --- a/_inc/client/components/global-notices/style.scss +++ b/_inc/client/components/global-notices/style.scss @@ -18,18 +18,24 @@ right: 16px; bottom: auto; left: auto; - max-width: calc( 100% - 32px ); + + /* `36px` being the width of the collapsed WP-admin sidebar */ + max-width: calc( 100% - 32px - 36px ); } @include breakpoint( ">960px" ) { top: 47px + 24px; right: 24px; - max-width: calc( 100% - 48px ); + + /* `160px` being the width of the WP-admin sidebar */ + max-width: calc( 100% - 48px - 160px ); } @include breakpoint( ">1040px" ) { right: 32px; - max-width: calc( 100% - 64px ); + + /* `160px` being the width of the WP-admin sidebar */ + max-width: calc( 100% - 64px - 160px ); } } diff --git a/_inc/client/components/notice/index.jsx b/_inc/client/components/notice/index.jsx index bfbe5f61619a..2c52ab9d2d5d 100644 --- a/_inc/client/components/notice/index.jsx +++ b/_inc/client/components/notice/index.jsx @@ -76,6 +76,10 @@ export default class SimpleNotice extends React.Component { return icon; }; + clearText( text ) { + return text.replace( /(<([^>]+)>)/gi, '' ); + } + render() { const { children, @@ -99,7 +103,7 @@ export default class SimpleNotice extends React.Component { - { text ? text : children } + { text ? this.clearText( text ) : children } { text ? children : null } { showDismiss && (