From aebf1737207df8d5812be154b2f25616d57f46ee Mon Sep 17 00:00:00 2001
From: Cohee <18619528+Cohee1207@users.noreply.github.com>
Date: Sun, 3 Sep 2023 01:52:34 +0300
Subject: [PATCH] Fix instruct mode being too cool for tiny phone screens

---
 public/css/mobile-styles.css | 8 +++++++-
 public/index.html            | 4 ++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/public/css/mobile-styles.css b/public/css/mobile-styles.css
index b0660b2c6..e05f77c27 100644
--- a/public/css/mobile-styles.css
+++ b/public/css/mobile-styles.css
@@ -270,6 +270,12 @@
     }
 }
 
+@media screen and (min-width: 1001px) {
+    #PygOverrides, #ContextFormatting {
+        flex: 1;
+    }
+}
+
 /*landscape mode phones and ipads*/
 @media screen and (max-width: 1000px) and (orientation: landscape) {
     body.waifuMode img.expression {
@@ -407,4 +413,4 @@
     #horde_model {
         height: unset;
     }
-}
\ No newline at end of file
+}
diff --git a/public/index.html b/public/index.html
index 3baaf575e..868530386 100644
--- a/public/index.html
+++ b/public/index.html
@@ -2151,7 +2151,7 @@
                     </a>
                 </h3>
                 <div class="flex-container">
-                    <div name="PygOverrides" class="flex1">
+                    <div id="PygOverrides">
                         <div>
                             <h4 data-i18n="Context Template">
                                 Context Template
@@ -2374,7 +2374,7 @@
 
                         </div>
                     </div>
-                    <div name="ContextFormatting" class="flex1">
+                    <div id="ContextFormatting">
                         <div data-newbie-hidden>
                             <h4><span data-i18n="Tokenizer">Tokenizer</span>
                                 <a href="https://docs.sillytavern.app/usage/core-concepts/advancedformatting/#tokenizer" class="notes-link" target="_blank">