From 0a7f06855b745d4a6bbb415cc9ba4fc94069980d Mon Sep 17 00:00:00 2001
From: RossAsscends <124905043+RossAscends@users.noreply.github.com>
Date: Sat, 18 Mar 2023 14:26:34 +0900
Subject: [PATCH] changed #chat and .mes CSS chat now starts with the first
 message on the bottom of the scroll just like CAI this is more intuitive for
 the swipe buttons as they don't move much

---
 public/style.css | 41 +++++++++++++++++++++++++++++++++++++----
 1 file changed, 37 insertions(+), 4 deletions(-)

diff --git a/public/style.css b/public/style.css
index 7a062d82e..9e3cf2d18 100644
--- a/public/style.css
+++ b/public/style.css
@@ -176,7 +176,26 @@ code {
 }
 
 #chat {
+
     overflow-x: hidden;
+    padding-bottom: 30px;
+    overflow-y: scroll;
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 40px;
+    bottom: 10px;
+    border-bottom: 1px solid var(--black30a);
+    border-left: 1px solid var(--black30a);
+    border-right: 1px solid var(--black30a);
+    backdrop-filter: blur(20px);
+    background-color: var(--black70a);
+    -webkit-backdrop-filter: blur(20px);
+    text-shadow: #000 0 0 3px;
+    scrollbar-width: thin;
+    transition: all 1s ease-in-out;
+
+    /*old style top to bottom flow*/
+/*     overflow-x: hidden;
     overflow-y: scroll;
     margin-top: 40px;
     border-bottom: 1px solid var(--black30a);
@@ -187,7 +206,7 @@ code {
     -webkit-backdrop-filter: blur(20px);
     text-shadow: #000 0 0 3px;
     scrollbar-width: thin;
-    transition: all 1s ease-in-out;
+    transition: all 1s ease-in-out; */
 
 }
 
@@ -344,12 +363,21 @@ code {
 
 
 .mes {
+
     display: grid;
+    grid-template-columns: min-content min-content auto min-content min-content;
+    padding: 10px 10px 0 10px;
+    margin-top: 0;
+    width: 100%;
+    color: var(--ivory, white);
+    align-self: flex-end;
+
+  /*   display: grid;
     grid-template-columns: min-content min-content auto min-content min-content;
     padding: 10px 10px 0 10px;
     vertical-align: top;
     width: 100%;
-    color: var(--ivory, white);
+    color: var(--ivory, white); */
 }
 
 .last_mes .mes_text {
@@ -2586,7 +2614,7 @@ a {
 
     #sheld {    /*margin around the sides, and a larger one on bottom to avoid iOS Home bar*/
         height: calc(100svh - 15px);
-        width: 100vw; //calc(100vw - 15px);
+        width: 100vw /* calc(100svw - 15px); */
         margin-left: 5px;
         margin-right: 5px;
         position: fixed;
@@ -2612,8 +2640,13 @@ a {
         max-height: 300px;
     }
 
+    #rm_api_block {
+        width:100vw;
+
+    }
+
     #right-nav-panel, #character_popup {        /* character_popup display needs work, "width:100%" items push outside the box */
-        width: 100%;
+        width: 100vw;
         box-shadow: none;
     }