From 29110616835ac33600dae2def7695566586652c8 Mon Sep 17 00:00:00 2001
From: Tetsuaki Hamano <tetsuaki.hamano@gmail.com>
Date: Sat, 16 Sep 2023 15:58:26 +0900
Subject: [PATCH 1/3] Font Library: fix modal width on mobile viewport

---
 .../components/global-styles/font-library-modal/index.js   | 3 +--
 .../components/global-styles/font-library-modal/style.scss | 7 +++++++
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/index.js b/packages/edit-site/src/components/global-styles/font-library-modal/index.js
index 6d55b130c85a4f..06675a9508be9d 100644
--- a/packages/edit-site/src/components/global-styles/font-library-modal/index.js
+++ b/packages/edit-site/src/components/global-styles/font-library-modal/index.js
@@ -18,9 +18,8 @@ function FontLibraryModal( {
 		<Modal
 			title={ __( 'Fonts' ) }
 			onRequestClose={ onRequestClose }
-			isFullScreen={ true }
+			isFullScreen
 			className="font-library-modal"
-			style={ { width: '65vw' } }
 		>
 			<TabPanel
 				className="font-library-modal__tab-panel"
diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
index 7de345b659b6e9..f4081bebab2c29 100644
--- a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
+++ b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
@@ -1,4 +1,11 @@
 .font-library-modal {
+	&.is-full-screen {
+
+		@include break-medium() {
+			width: 65vw;
+		}
+	}
+
 	.components-modal__header {
 		border-bottom: none;
 	}

From 1dc95d5d59dd13e94f951317edc200d9902546ed Mon Sep 17 00:00:00 2001
From: Tetsuaki Hamano <tetsuaki.hamano@gmail.com>
Date: Sat, 23 Sep 2023 00:38:42 +0900
Subject: [PATCH 2/3] Don't use internal selector

---
 .../components/global-styles/font-library-modal/style.scss   | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
index ece97dfc5aeddf..8ab40afc81cbb8 100644
--- a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
+++ b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
@@ -1,5 +1,8 @@
 .font-library-modal {
-	&.is-full-screen {
+	// @todo: If a new prop is added to the Modal component that constrains
+	// the the content width, we should use that prop instead of this style.
+	// see https://github.com/WordPress/gutenberg/issues/54471.
+	&.font-library-modal {
 
 		@include break-medium() {
 			width: 65vw;

From b12c27f3974bf8a26222896b538135d969443c23 Mon Sep 17 00:00:00 2001
From: Tetsuaki Hamano <tetsuaki.hamano@gmail.com>
Date: Sat, 23 Sep 2023 00:41:00 +0900
Subject: [PATCH 3/3] Fix typo

---
 .../src/components/global-styles/font-library-modal/style.scss  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
index 8ab40afc81cbb8..663aef94ab7e62 100644
--- a/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
+++ b/packages/edit-site/src/components/global-styles/font-library-modal/style.scss
@@ -1,6 +1,6 @@
 .font-library-modal {
 	// @todo: If a new prop is added to the Modal component that constrains
-	// the the content width, we should use that prop instead of this style.
+	// the content width, we should use that prop instead of this style.
 	// see https://github.com/WordPress/gutenberg/issues/54471.
 	&.font-library-modal {