From 969fc8d429d67141bd55bbaf7dfa64fe5bd13b9a Mon Sep 17 00:00:00 2001
From: Riad Benguella <benguella@gmail.com>
Date: Wed, 29 Sep 2021 14:49:51 +0100
Subject: [PATCH 1/2] Add a beta indicator for the global styles sidebar

---
 .../src/components/sidebar/global-styles-sidebar.js  |  3 +++
 packages/edit-site/src/components/sidebar/style.scss | 12 ++++++++++++
 2 files changed, 15 insertions(+)

diff --git a/packages/edit-site/src/components/sidebar/global-styles-sidebar.js b/packages/edit-site/src/components/sidebar/global-styles-sidebar.js
index 6a9a507c3a9476..cdaf1f2d2d50b7 100644
--- a/packages/edit-site/src/components/sidebar/global-styles-sidebar.js
+++ b/packages/edit-site/src/components/sidebar/global-styles-sidebar.js
@@ -221,6 +221,9 @@ export default function GlobalStylesSidebar() {
 			header={
 				<>
 					<strong>{ __( 'Styles' ) }</strong>
+					<span className="edit-site-global-styles-sidebar__beta">
+						{ __( 'Beta' ) }
+					</span>
 					<Button
 						className="edit-site-global-styles-sidebar__reset-button"
 						isSmall
diff --git a/packages/edit-site/src/components/sidebar/style.scss b/packages/edit-site/src/components/sidebar/style.scss
index 65c5bd6c054ab1..6ac6cb53ecad79 100644
--- a/packages/edit-site/src/components/sidebar/style.scss
+++ b/packages/edit-site/src/components/sidebar/style.scss
@@ -65,3 +65,15 @@
 .edit-site-global-styles-color-palette-panel {
 	padding: $grid-unit-20;
 }
+
+.edit-site-global-styles-sidebar__beta {
+	display: inline-flex;
+	margin-left: $grid-unit-10;
+	padding: 0 $grid-unit-10;
+	height: $grid-unit-30;
+	border-radius: $radius-block-ui;
+	background-color: $black;
+	color: $white;
+	align-items: center;
+	font-size: $helptext-font-size;
+}

From 74ed0a4a00ecd58fcffe2f9d449f2ee4906ca50e Mon Sep 17 00:00:00 2001
From: jasmussen <joen@automattic.com>
Date: Wed, 29 Sep 2021 16:06:42 +0200
Subject: [PATCH 2/2] Add a line-height to align the beta message.

---
 packages/edit-site/src/components/sidebar/style.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/edit-site/src/components/sidebar/style.scss b/packages/edit-site/src/components/sidebar/style.scss
index 6ac6cb53ecad79..b74ba0b9370276 100644
--- a/packages/edit-site/src/components/sidebar/style.scss
+++ b/packages/edit-site/src/components/sidebar/style.scss
@@ -76,4 +76,5 @@
 	color: $white;
 	align-items: center;
 	font-size: $helptext-font-size;
+	line-height: 1;
 }