From d102d89277e3f299a9bffccd1bd8c4cc134dd474 Mon Sep 17 00:00:00 2001
From: Lam Nguyen <la.nguyen@f5.com>
Date: Thu, 6 Mar 2025 09:20:11 -0800
Subject: [PATCH 1/2] fix: Changed mainframe breakpoints

---
 assets/css/v2/style.css | 39 ++++++++++++++++++++++-----------------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
index 81a0c5d..1e31362 100644
--- a/assets/css/v2/style.css
+++ b/assets/css/v2/style.css
@@ -204,10 +204,7 @@ nav {
 
 .content-layout {
   display: grid;
-  grid-template-columns: var(--text-content-width-iphone-13) var(
-      --side-gutter-width
-    );
-  column-gap: var(--component-gap);
+  grid-template-columns: var(--text-content-width-iphone-13);
 }
 
 .docs-container {
@@ -219,12 +216,6 @@ nav {
   flex-direction: column;
 }
 
-@media (max-width: 1528px) {
-  .sidebar-layout {
-    display: none;
-  }
-}
-
 #searchbox {
   width: 24rem;
   display: none;
@@ -271,13 +262,13 @@ nav {
   width: 100%;
 }
 
-@media (min-width: 1512px) {
-  /* Macbook Pro 14 */
-  .base-layout {
+@media (min-width: 1185px) {
+  .main-layout {
     display: grid;
-    grid-template-rows: repeat(2, auto);
+    grid-template-columns: var(--sidebar-width) var(
+        --text-content-width-iphone-13
+      );
     column-gap: var(--component-gap);
-    max-width: 100%;
   }
 
   .breadcrumb-layout {
@@ -286,6 +277,21 @@ nav {
     column-gap: var(--component-gap);
     align-items: center;
   }
+}
+@media (max-width: 1184px) {
+  .sidebar-layout {
+    display: none;
+  }
+}
+
+@media (min-width: 1512px) {
+  /* Macbook Pro 14 */
+  .base-layout {
+    display: grid;
+    grid-template-rows: repeat(2, auto);
+    column-gap: var(--component-gap);
+    max-width: 100%;
+  }
 
   .text-content {
     grid-template-columns: var(--text-content-width-mbp-14) var(
@@ -727,8 +733,7 @@ atomic-search-layout atomic-layout-section[section="search"] {
 /* content */
 main {
   flex: 1;
-  max-width: 50rem;
-  min-width: 40rem;
+  min-width: 30rem;
   margin: 2rem 2rem;
 }
 

From 968490af9150c61cc9a9a78c9b49639cfdb90d42 Mon Sep 17 00:00:00 2001
From: Lam Nguyen <la.nguyen@f5.com>
Date: Wed, 12 Mar 2025 05:49:53 -0700
Subject: [PATCH 2/2] fix: Changed layout to handle tablet sizes more cleanly

---
 assets/css/v2/style.css | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
index 1e31362..a9689e4 100644
--- a/assets/css/v2/style.css
+++ b/assets/css/v2/style.css
@@ -204,7 +204,7 @@ nav {
 
 .content-layout {
   display: grid;
-  grid-template-columns: var(--text-content-width-iphone-13);
+  grid-template-columns: var(--text-content-width-iphone-13) 1fr;
 }
 
 .docs-container {
@@ -246,12 +246,13 @@ nav {
 }
 
 .text-content {
-  grid-column-start: 1;
+  grid-column: 1 / -1;
   display: grid;
+  grid-template-columns: var(--text-content-width-iphone-13) 1fr;
 }
 
 .text-content > :not(.wide) {
-  grid-column: 1;
+  grid-column: 1 / -1;
 }
 
 .text-content .wide {
@@ -265,9 +266,7 @@ nav {
 @media (min-width: 1185px) {
   .main-layout {
     display: grid;
-    grid-template-columns: var(--sidebar-width) var(
-        --text-content-width-iphone-13
-      );
+    grid-template-columns: var(--sidebar-width) 1fr;
     column-gap: var(--component-gap);
   }
 
@@ -300,6 +299,10 @@ nav {
     column-gap: var(--component-gap);
   }
 
+  .text-content > :not(.wide) {
+    grid-column: 1;
+  }
+
   .main-layout {
     display: grid;
     grid-template-columns: var(--sidebar-width) 1fr;