Bump gradio version

It looks uglier, but the old one was bugged and unstable.

modules/html_generator.py

@@ -215,14 +215,20 @@ def generate_chat_html(history, name1, name2, character):
       font-weight: bold;
     }
 
-    .body {
+    .message-body {
     }
 
-    .body img {
+    .message-body img {
       max-width: 300px;
       max-height: 300px;
       border-radius: 20px;
     }
+
+    .message-body p {
+      margin-bottom: 0 !important;
+      font-size: 15px !important;
+      line-height: 1.428571429 !important;
+    }
     """
 
     output = ''
@@ -263,7 +269,7 @@ def generate_chat_html(history, name1, name2, character):
                   <div class="username">
                     {name2}
                   </div>
-                  <div class="body">
+                  <div class="message-body">
                     {p}
                   </div>
                 </div>
@@ -281,7 +287,7 @@ def generate_chat_html(history, name1, name2, character):
                       <div class="username">
                         {name1}
                       </div>
-                      <div class="body">
+                      <div class="message-body">
                         {p}
                       </div>
                     </div>

requirements.txt

@@ -1,7 +1,7 @@
 accelerate==0.15.0
 beautifulsoup4
 bitsandbytes==0.37.0
-gradio==3.15.0
+gradio==3.18.0
 numpy
 safetensors==0.2.8
 git+https://github.com/huggingface/transformers

server.py

@@ -859,7 +859,8 @@ else:
     default_text = settings['prompt']
 description = f"\n\n# Text generation lab\nGenerate text using Large Language Models.\n"
 css = ".my-4 {margin-top: 0} .py-6 {padding-top: 2.5rem} #refresh-button {flex: none; margin: 0; padding: 0; min-width: 50px; border: none; box-shadow: none; border-radius: 0} #download-label, #upload-label {min-height: 0}"
-chat_css = ".h-\[40vh\] {height: 66.67vh} .gradio-container {max-width: 800px; margin-left: auto; margin-right: auto} .w-screen {width: unset}"
+chat_css = ".h-\[40vh\] {height: 66.67vh} .gradio-container {max-width: 800px; margin-left: auto; margin-right: auto} .w-screen {width: unset} div.svelte-362y77>*, div.svelte-362y77>.form>* {flex-wrap: nowrap}"
+
 suffix = '_pygmalion' if 'pygmalion' in model_name.lower() else ''
 buttons = {}
 gen_events = []