diff --git a/src/app.scss b/src/app.scss
index 499146a..ae269af 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -141,19 +141,19 @@ select option.is-default {
   max-width: 90%;
   margin-right: auto;
   margin-left: auto;
-  width: fit-content;
+  width: 90%;
 }
 
 .assistant-message {
   max-width: 90%;
   margin-right: auto;
   margin-left: auto;
-  width: fit-content;
+  width: 90%;
 }
 
 /* Swap the border on user messages to the other side */
 .user-message>.message-body {
-  border-width: 0 4px 0 0 !important;
+  border-width: 0 0 0 4px !important;
 }
 
 /* Show the edit button on hover of the chat name */
@@ -166,7 +166,7 @@ body {
   font-family: "Source Sans 3", "Fira Sans", sans-serif !important;
 }
 
-.code-block {
+.code {
   font-family: "Monaco", "Hack", monospace !important;
 }
 /* Style the chat input */
@@ -203,6 +203,17 @@ body {
   }
 }
 
+@media (prefers-color-scheme: dark) {
+  .message.is-success .message-body
+  {
+    color: #FFFEFF !important;
+  }
+
+  .message.is-info .message-body
+  {
+    color: #FEFFFF !important;
+  }
+}
 /* Support for dark mode */
 $modal-background-background-color-dark: rgba($dark, 0.86) !default; // remove this once a new version of bulma-prefers-dark is released
 @import "/node_modules/bulma-prefers-dark/build/bulma-prefers-dark.sass";
@@ -635,7 +646,7 @@ aside.menu.main-menu .menu-expanse {
   border-radius: 0px 4px 4px 0px;
 }
 .user-message .tool-drawer-mask {
-  border-radius: 4px 0px 0px 4px;
+  border-radius: 0px 4px 4px 0px;
 }
 .message:last-of-type .tool-drawer, .tool-drawer-mask {
   top: auto;
@@ -645,7 +656,7 @@ aside.menu.main-menu .menu-expanse {
   left:100%;
 }
 .user-message .tool-drawer, .user-message .tool-drawer-mask {
-  right:100%;
+  left:100%;
 }
 .assistant-message:hover .tool-drawer,
 .assistant-message.editing .tool-drawer {