From 1bcf299201a34a66b8404bfb540ad6da2bfa8e30 Mon Sep 17 00:00:00 2001
From: kwaroran <kwaworan@gmail.com>
Date: Thu, 25 May 2023 21:04:22 +0900
Subject: [PATCH] [fix] chat screen overflow

---
 src/App.svelte                               |  2 +-
 src/lib/ChatScreens/Chat.svelte              | 10 +++++-----
 src/lib/ChatScreens/ChatScreen.svelte        |  2 +-
 src/lib/ChatScreens/DefaultChatScreen.svelte |  4 ++--
 src/ts/globalApi.ts                          |  8 +++++++-
 5 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index 5d84b993..fd278e0c 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -21,7 +21,7 @@
 
 </script>
 
-<main class="flex bg-bg w-full h-full">
+<main class="flex bg-bg w-full h-full max-w-100vw">
     {#if !$loadedStore}
         <div class="w-full h-full flex justify-center items-center text-gray-200 text-xl">
             <span>Loading...</span>
diff --git a/src/lib/ChatScreens/Chat.svelte b/src/lib/ChatScreens/Chat.svelte
index cf9cc4cd..76f2cc67 100644
--- a/src/lib/ChatScreens/Chat.svelte
+++ b/src/lib/ChatScreens/Chat.svelte
@@ -64,15 +64,15 @@
     $: displaya(message)
 </script>
 <div class="flex max-w-full justify-center" class:bgc={isLastMemory}>
-    <div class="text-neutral-200 mt-1 mb-1 p-2 bg-transparent flex-grow ml-4 mr-4 border-t-gray-900 border-opacity-30 border-transparent flexium items-start">
+    <div class="text-neutral-200 mt-1 ml-4 mr-4 mb-1 p-2 bg-transparent flex-grow border-t-gray-900 border-opacity-30 border-transparent flexium items-start max-w-full" >
         {#await img}
-            <div class="shadow-lg bg-gray-500 mt-2" style={`height:${$DataBase.iconsize * 3.5 / 100}rem;width:${$DataBase.iconsize * 3.5 / 100}rem`}
+            <div class="shadow-lg bg-gray-500 mt-2" style={`height:${$DataBase.iconsize * 3.5 / 100}rem;width:${$DataBase.iconsize * 3.5 / 100}rem;min-width:${$DataBase.iconsize * 3.5 / 100}rem`}
             class:rounded-md={!$DataBase.roundIcons} class:rounded-full={$DataBase.roundIcons} />
         {:then m}
-            <div class="shadow-lg bg-gray-500 mt-2" style={m + `height:${$DataBase.iconsize * 3.5 / 100}rem;width:${$DataBase.iconsize * 3.5 / 100}rem`}
+            <div class="shadow-lg bg-gray-500 mt-2" style={m + `height:${$DataBase.iconsize * 3.5 / 100}rem;width:${$DataBase.iconsize * 3.5 / 100}rem;min-width:${$DataBase.iconsize * 3.5 / 100}rem`}
             class:rounded-md={!$DataBase.roundIcons} class:rounded-full={$DataBase.roundIcons}  />
         {/await}
-        <span class="flex flex-col ml-4 w-full">
+        <span class="flex flex-col ml-4 w-full max-w-full min-w-0">
             <div class="flexium items-center chat">
                 <span class="chat text-xl unmargin">{name}</span>
                 <div class="flex-grow flex items-center justify-end text-gray-500">
@@ -129,7 +129,7 @@
                 <AutoresizeArea bind:value={message} />
             {:else}
                 {#await ParseMarkdown(msgDisplay, character) then md} 
-                    <span class="text chat chattext prose prose-invert"
+                    <span class="text chat chattext prose prose-invert minw-0"
                         style:font-size="{0.875 * ($DataBase.zoomsize / 100)}rem"
                         style:line-height="{1.25 * ($DataBase.zoomsize / 100)}rem"
                     >{@html md}</span>
diff --git a/src/lib/ChatScreens/ChatScreen.svelte b/src/lib/ChatScreens/ChatScreen.svelte
index 4982e4c8..03a2f58c 100644
--- a/src/lib/ChatScreens/ChatScreen.svelte
+++ b/src/lib/ChatScreens/ChatScreen.svelte
@@ -26,7 +26,7 @@
     })()
 </script>
 {#if $DataBase.theme === ''}
-    <div class="flex-grow h-full" style={bgImg}>
+    <div class="flex-grow h-full min-w-0" style={bgImg}>
         {#if $selectedCharID >= 0}
             {#if $DataBase.characters[$selectedCharID].viewScreen !== 'none'}
                 <ResizeBox />
diff --git a/src/lib/ChatScreens/DefaultChatScreen.svelte b/src/lib/ChatScreens/DefaultChatScreen.svelte
index 5abb26e9..e72c7a07 100644
--- a/src/lib/ChatScreens/DefaultChatScreen.svelte
+++ b/src/lib/ChatScreens/DefaultChatScreen.svelte
@@ -14,7 +14,7 @@
     import { processScript } from "src/ts/process/scripts";
     import GithubStars from "../Others/GithubStars.svelte";
     import CreatorQuote from "./CreatorQuote.svelte";
-  import { stopTTS } from "src/ts/process/tts";
+    import { stopTTS } from "src/ts/process/tts";
 
     let messageInput = ''
     let openMenu = false
@@ -200,7 +200,7 @@
             }
         }}>
             <div class="flex items-end mt-2 mb-2">
-                <textarea class="text-neutral-200 p-2 bg-transparent input-text text-xl flex-grow ml-4 mr-2 border-gray-700 resize-none focus:bg-selected maxw overflow-y-hidden overflow-x-hidden"
+                <textarea class="text-neutral-200 p-2 bg-transparent input-text text-xl flex-grow ml-4 mr-2 border-gray-700 resize-none focus:bg-selected maxw overflow-y-hidden overflow-x-hidden max-w-full"
                     bind:value={messageInput}
                     bind:this={inputEle}
                     on:keydown={(e) => {
diff --git a/src/ts/globalApi.ts b/src/ts/globalApi.ts
index dbe496ea..c8c1083e 100644
--- a/src/ts/globalApi.ts
+++ b/src/ts/globalApi.ts
@@ -200,17 +200,23 @@ export async function saveDb(){
             )
             if(isTauri){
                 await writeBinaryFile('database/database.bin', dbData, {dir: BaseDirectory.AppData})
+                await writeBinaryFile(`database/dbbackup-${(Date.now()/100).toFixed()}.bin`, dbData, {dir: BaseDirectory.AppData})
             }
             else{
                 await forageStorage.setItem('database/database.bin', dbData)
+                await forageStorage.setItem(`database/dbbackup-${(Date.now()/100).toFixed()}.bin`, dbData)
             }
-            console.log('saved')
         }
 
         await sleep(500)
     }
 }
 
+
+async function getDbBackups() {
+    
+}
+
 let usingSw = false
 
 export async function loadData() {