misc: Add max widths to debug page message states (#25725)

cypress-io · Feb 7, 2023 · f941005 · f941005 · cypress-bot · Feb 7, 2023
1 parent 1a9bc2c
commit f941005
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 2 deletions.
diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md
@@ -10,6 +10,7 @@ _Released 02/14/2023 (PENDING)_
 **Misc:**
 
 - Improved the layout of the Debug Page on smaller viewports when there is a pending run. Addresses [#25664](https://github.com/cypress-io/cypress/issues/25664).
+- Improved the layout of the Debug Page when displaying informational messages. Addresses [#25669](https://github.com/cypress-io/cypress/issues/25669).
 - Icons in Debug page will no longer shrink at small viewports. Addresses [#25665](https://github.com/cypress-io/cypress/issues/25665).
 
 **Dependency Updates:**

diff --git a/packages/app/src/debug/DebugOverLimit.vue b/packages/app/src/debug/DebugOverLimit.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="flex flex-col items-center"
+    class="flex flex-col max-w-440px items-center"
   >
     <LockedProject :class="iconClasses" />
     <span class="font-medium mt-24px text-gray-900">

diff --git a/packages/app/src/debug/empty/DebugEmptyView.vue b/packages/app/src/debug/empty/DebugEmptyView.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col my-45px items-center">
+  <div class="flex flex-col mx-auto my-45px max-w-640px items-center">
     <div class="flex flex-col items-center justify-evenly">
       <div><i-cy-box-open_x48 class="icon-dark-gray-500 icon-light-indigo-100" /></div>
       <div class="flex flex-col mx-[20%] mt-25px mb-20px items-center">