From 9fe14c2b9164f2e1a44b7044bcfbb070889ac53b Mon Sep 17 00:00:00 2001
From: StevenDufresne <dufresnesteven@gmail.com>
Date: Mon, 6 Nov 2023 14:08:40 +0900
Subject: [PATCH 1/3] Be specific about the padding to stop it from growing too
 large.

---
 .../themes/wporg-developer-2023/src/code-source/style.scss   | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss b/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
index cca068e68..e318203e8 100644
--- a/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
+++ b/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
@@ -19,6 +19,11 @@ $border_radius: 2px;
 			color: var(--wp--preset--color--blueberry-1) !important;
 			font-weight: 400;
 			font-size: 13px;
+
+			&:focus {
+				border-width: unset;
+				padding: var(--wp--preset--spacing--10);
+			}
 		}
 
 		> span:last-child {

From 6c7f5315dced20505c8600df6e224961fc059f76 Mon Sep 17 00:00:00 2001
From: StevenDufresne <dufresnesteven@gmail.com>
Date: Mon, 6 Nov 2023 14:16:29 +0900
Subject: [PATCH 2/3] Use our gutenberg style class first.

---
 .../wporg-developer-2023/js/function-reference.js    |  4 ++--
 .../wporg-developer-2023/src/code-source/style.scss  | 12 +-----------
 2 files changed, 3 insertions(+), 13 deletions(-)

diff --git a/source/wp-content/themes/wporg-developer-2023/js/function-reference.js b/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
index c9ba92b09..25026bc18 100644
--- a/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
+++ b/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
@@ -34,7 +34,7 @@ jQuery( function ( $ ) {
 
 		$element.wrap( '<div class="wporg-developer-code-block"></div>' );
 
-		const $copyButtonContainer = $( '<div class="wp-block-button is-style-outline"></div>' );
+		const $copyButtonContainer = $( '<div class="wp-block-button is-style-outline is-small"></div>' );
 		const $copyButton = $( '<a href="#" class="wp-block-button__link wp-element-button"></a>' );
 		$copyButtonContainer.append( $copyButton );
 
@@ -74,7 +74,7 @@ jQuery( function ( $ ) {
 		if ( originalHeight > MIN_HEIGHT ) {
 			$element.data( 'height', originalHeight );
 
-			const $expandButtonContainer = $( '<div class="wp-block-button is-style-outline"></div>' );
+			const $expandButtonContainer = $( '<div class="wp-block-button is-style-outline is-small"></div>' );
 			const $expandButton = $(
 				'<a href="#" class="wp-block-button__link wp-element-button" aria-controls="wporg-source-code"></a>'
 			);
diff --git a/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss b/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
index e318203e8..09018b784 100644
--- a/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
+++ b/source/wp-content/themes/wporg-developer-2023/src/code-source/style.scss
@@ -13,17 +13,7 @@ $border_radius: 2px;
 		gap: var(--wp--preset--spacing--10);
 
 		.wp-block-button a {
-			padding: var(--wp--preset--spacing--10);
-			background-color: var(--wp--preset--color--white) !important;
-			border-color: var(--wp--preset--color--blueberry-1) !important;
-			color: var(--wp--preset--color--blueberry-1) !important;
-			font-weight: 400;
-			font-size: 13px;
-
-			&:focus {
-				border-width: unset;
-				padding: var(--wp--preset--spacing--10);
-			}
+			background-color: var(--wp--preset--color--white);
 		}
 
 		> span:last-child {

From 1e22d0e769bb7dc68abc278ca935d82e41299bf8 Mon Sep 17 00:00:00 2001
From: Adam Wood <1017872+adamwoodnz@users.noreply.github.com>
Date: Tue, 7 Nov 2023 16:01:33 +1300
Subject: [PATCH 3/3] Fix white button background being overridden

---
 .../themes/wporg-developer-2023/js/function-reference.js      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/source/wp-content/themes/wporg-developer-2023/js/function-reference.js b/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
index 25026bc18..93599451c 100644
--- a/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
+++ b/source/wp-content/themes/wporg-developer-2023/js/function-reference.js
@@ -35,7 +35,7 @@ jQuery( function ( $ ) {
 		$element.wrap( '<div class="wporg-developer-code-block"></div>' );
 
 		const $copyButtonContainer = $( '<div class="wp-block-button is-style-outline is-small"></div>' );
-		const $copyButton = $( '<a href="#" class="wp-block-button__link wp-element-button"></a>' );
+		const $copyButton = $( '<a href="#" class="wp-block-button__link wp-element-button has-background"></a>' );
 		$copyButtonContainer.append( $copyButton );
 
 		$copyButton.text( wporgFunctionReferenceI18n.copy );
@@ -76,7 +76,7 @@ jQuery( function ( $ ) {
 
 			const $expandButtonContainer = $( '<div class="wp-block-button is-style-outline is-small"></div>' );
 			const $expandButton = $(
-				'<a href="#" class="wp-block-button__link wp-element-button" aria-controls="wporg-source-code"></a>'
+				'<a href="#" class="wp-block-button__link wp-element-button has-background" aria-controls="wporg-source-code"></a>'
 			);
 			$expandButton.on( 'click', function ( event ) {
 				event.preventDefault();