From 5ede05769622ef9c7733d398ab55850740a21ad6 Mon Sep 17 00:00:00 2001
From: abaicus <baicusandrei@me.com>
Date: Fri, 31 Jan 2025 20:21:26 +0200
Subject: [PATCH] chore: compact docs and promo sections in customizer

---
 .../src/scss/_documentation.scss              | 43 +++++++------
 .../customizer-controls/src/scss/_upsell.scss | 63 +++++++++++--------
 2 files changed, 62 insertions(+), 44 deletions(-)

diff --git a/assets/apps/customizer-controls/src/scss/_documentation.scss b/assets/apps/customizer-controls/src/scss/_documentation.scss
index 0127d74c85..305dda1ece 100644
--- a/assets/apps/customizer-controls/src/scss/_documentation.scss
+++ b/assets/apps/customizer-controls/src/scss/_documentation.scss
@@ -1,25 +1,32 @@
 .control-section.neve-documentation {
-  display: block !important;
-  margin-bottom: 0;
-  margin-top: -1px;
-  .documentation-inner {
-	display: flex;
-  }
-  .neve-customizer-heading {
-	padding: 7px 10px 7px 14px;
-	display: flex;
-	flex-grow: 1;
-	margin: auto;
-	letter-spacing: initial;
-	font-size: 14px;
-	font-weight: 600;
+	display: block !important;
+	margin-bottom: 0;
+	margin-top: -1px;
 
-	&:hover, &:focus-within {
-	  cursor: default;
+	.documentation-inner {
+		display: flex;
+	}
+	.neve-customizer-heading {
+		padding: 5px 15px 5px 18px;
+		display: flex;
+		flex-grow: 1;
+		margin: auto;
+		align-items: center;
+		justify-content: space-between;
+		letter-spacing: initial;
+		font-size: 14px;
+		font-weight: 600;
+		gap: 10px;
+		height: unset;
+
+		&:hover,
+		&:focus-within {
+			cursor: default;
+		}
 	}
 
 	.components-button {
-	  margin-left: auto;
+		height: auto;
+		padding: 9px 15px;
 	}
-  }
 }
diff --git a/assets/apps/customizer-controls/src/scss/_upsell.scss b/assets/apps/customizer-controls/src/scss/_upsell.scss
index 8ef480a567..6aa6289638 100644
--- a/assets/apps/customizer-controls/src/scss/_upsell.scss
+++ b/assets/apps/customizer-controls/src/scss/_upsell.scss
@@ -1,36 +1,47 @@
-$upsell_blue: #0065A6 !default;
+$upsell_blue: #0065a6 !default;
 
 .control-section.neve-upsell {
-  	margin-bottom: 0;
-  	.upsell-inner {
-	  display: flex;
+	border-top: none !important;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+
+	&:hover {
+		border-left-color: $upsell_blue;
+	}
+
+	margin-bottom: 0;
+	.upsell-inner {
+		display: flex;
 	}
 	.neve-customizer-heading {
-	  color: $upsell_blue;
-	  padding: 7px 10px 7px 14px;
-	  display: flex;
-	  flex-grow: 1;
-	  margin: auto;
-	  letter-spacing: initial;
-	  font-size: 14px;
-	  font-weight: 600;
+		color: $upsell_blue;
+		padding: 5px 15px 5px 18px;
+		display: flex;
+		flex-grow: 1;
+		margin: auto;
+		letter-spacing: initial;
+		font-size: 14px;
+		align-items: center;
+		gap: 10px;
+		justify-content: space-between;
+		height: auto;
 
-	  &:hover, &:focus-within {
-		background-color: $upsell_blue;
-		color: #fff;
-		cursor: default;
+		&:hover,
+		&:focus-within {
+			background-color: $upsell_blue;
+			color: #fff;
+			cursor: default;
 
-		.components-button {
-		  background: #fff;
-		  color: $upsell_blue;
+			.components-button {
+				background: #fff;
+				color: $upsell_blue;
+			}
 		}
-	  }
 
-	  .components-button {
-		margin-left: auto;
-		font-weight: 600;
-		font-size: 14px;
-		background: $upsell_blue;
-	  }
+		.components-button {
+			background: $upsell_blue;
+			height: auto;
+			padding: 9px 15px;
+		}
 	}
 }