Improved chat view and message bar (#33)

* added style.css and style-dark.css

* keep message text view sensitive at all times

* improved chat view ui and message view

* added clamps for chat container and message

src/alpaca.gresource.xml

@@ -1,6 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/com/jeffser/Alpaca">
+    <file>style.css</file>
+    <file>style-dark.css</file>
     <file preprocess="xml-stripblanks">window.ui</file>
     <file preprocess="xml-stripblanks">gtk/help-overlay.ui</file>
   </gresource>

src/style-dark.css

@@ -0,0 +1,7 @@
+.message-input {
+  background-color: #343434;
+}
+
+.message-text-view {
+  background-color: #343434;
+}

src/style.css

@@ -0,0 +1,8 @@
+.message-input {
+  background-color: #EBEBEB;
+  border-radius: 10px;
+}
+
+.message-text-view {
+  background-color: #EBEBEB;
+}

src/window.py

@@ -381,7 +381,7 @@ class AlpacaWindow(Adw.ApplicationWindow):
         GLib.idle_add(self.image_button.set_css_classes, [])
         GLib.idle_add(self.image_button.get_child().set_icon_name, "image-x-generic-symbolic")
         self.attached_image = {"path": None, "base64": None}
-        GLib.idle_add(self.message_text_view.set_sensitive, True)
+        # GLib.idle_add(self.message_text_view.set_sensitive, True)
         if response['status'] == 'error':
             GLib.idle_add(self.show_toast, 'error', 1, self.connection_overlay)
             GLib.idle_add(self.connection_error)
@@ -397,7 +397,7 @@ class AlpacaWindow(Adw.ApplicationWindow):
             self.add_chat_button.set_sensitive(True)
             self.export_chat_button.set_sensitive(True)
             self.import_chat_button.set_sensitive(True)
-            self.message_text_view.set_sensitive(True)
+            # self.message_text_view.set_sensitive(True)
             self.send_button.set_css_classes(["suggested-action"])
             self.send_button.get_child().set_label("Send")
             self.send_button.get_child().set_icon_name("send-to-symbolic")
@@ -423,7 +423,7 @@ class AlpacaWindow(Adw.ApplicationWindow):
             }
             if self.verify_if_image_can_be_used() and self.attached_image["base64"] is not None:
                 data["messages"][-1]["images"] = [self.attached_image["base64"]]
-            self.message_text_view.set_sensitive(False)
+            # self.message_text_view.set_sensitive(False)
             self.send_button.set_css_classes(["destructive-action"])
             self.send_button.get_child().set_label("Stop")
             self.send_button.get_child().set_icon_name("edit-delete-symbolic")

src/window.ui

@@ -158,18 +158,20 @@
                 <property name="content">
                   <object class="GtkBox"><!--ACTUAL CONTENT-->
                     <property name="orientation">1</property>
-                    <property name="margin-start">24</property>
-                    <property name="margin-end">24</property>
-                    <property name="margin-bottom">24</property>
                     <property name="vexpand">true</property>
                     <property name="hexpand">true</property>
-
                     <child>
                       <object class="GtkScrolledWindow" id="chat_window">
-                        <property name="margin-bottom">12</property>
                         <property name="propagate-natural-height">true</property>
                         <property name="kinetic-scrolling">true</property>
                         <property name="vexpand">true</property>
+                        <style>
+                          <class name="undershoot-bottom"/>
+                        </style>
+                        <child>
+                          <object class="AdwClamp">
+                            <property name="maximum-size">1000</property>
+                            <property name="tightening-threshold">800</property>
                             <child>
                               <object class="GtkBox" id="chat_container">
                                 <property name="orientation">1</property>
@@ -185,32 +187,46 @@
                             </child>
                           </object>
                         </child>
+                      </object>
+                    </child>
 
+                    <child>
+                      <object class="AdwClamp">
+                        <property name="maximum-size">1000</property>
+                        <property name="tightening-threshold">800</property>
                       <child>
                         <object class="GtkBox">
                           <property name="orientation">0</property>
                           <property name="spacing">12</property>
-                        <child>
-                          <object class="GtkScrolledWindow">
-                            <property name="has-frame">true</property>
-                            <style>
-                              <class name="card"/>
-                              <class name="view"/>
-                            </style>
-                            <child>
-                              <object class="GtkTextView" id="message_text_view">
-                                <property name="wrap-mode">word</property>
                           <property name="margin-top">12</property>
                           <property name="margin-bottom">12</property>
                           <property name="margin-start">12</property>
                           <property name="margin-end">12</property>
+                          <child>
+                            <object class="GtkBox">
+                              <style>
+                                <class name="message-input"/>
+                              </style>
+                              <child>
+                                <object class="GtkScrolledWindow">
+                                  <property name="margin-start">12</property>
+                                  <property name="margin-end">12</property>
+
+                                  <child>
+                                    <object class="GtkTextView" id="message_text_view">
+                                      <property name="wrap-mode">word</property>
+                                      <property name="top-margin">6</property>
+                                      <property name="bottom-margin">6</property>
+                                      <property name="margin-end">12</property>
                                       <property name="hexpand">true</property>
                                       <style>
-                                  <class name="view"/>
+                                        <class name="message-text-view"/>
                                       </style>
                                     </object>
                                   </child>
                                 </object>
+                              </child>
+                            </object>
 
                             </child>
                             <child>
@@ -246,6 +262,9 @@
                             </child>
                           </object>
                         </child>
+                      </object>
+                    </child>
+
 
                   </object><!--END OF CONTENT-->
                 </property>