From 9f5bdddb8fca22516fc7de14950840ba2527a3c5 Mon Sep 17 00:00:00 2001
From: Joakim Persson <joakim.persson@icloud.com>
Date: Tue, 30 Jul 2024 00:14:54 +0200
Subject: [PATCH] =?UTF-8?q?F=C3=B6rb=C3=A4ttrat=20det=20visuella=20genom?=
 =?UTF-8?q?=20att=20=C3=A4ndra=20f=C3=A4rg=20p=C3=A5=20knapp=20och=20ta=20?=
 =?UTF-8?q?bort=20storleksbegr=C3=A4nsning=20p=C3=A5=20chatt-rutan?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 smartassist/src/static/css/clientstyle.css | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/smartassist/src/static/css/clientstyle.css b/smartassist/src/static/css/clientstyle.css
index a160ceb..8169ee2 100644
--- a/smartassist/src/static/css/clientstyle.css
+++ b/smartassist/src/static/css/clientstyle.css
@@ -14,9 +14,10 @@ h1 {
 }
 
 #chatbox {
-    width: 80%;
-    max-width: 500px;
-    background-color: #fff;
+    width: calc(50% - 60px); /* Adjust width for input and button */
+    /* max-width: 500px; */
+    height: 80px;
+    background-color: #e1dcccb8;
     border-radius: 10px;
     padding: 20px;
     box-shadow: 0 4px 8px rgba(0,0,0,0.1);
@@ -36,7 +37,8 @@ h1 {
 }
 
 .ai-response {
-    background-color: #f0f8ff;
+    /* background-color: #f0f8ff; */
+    background-color: #e1dcccb8;
     padding: 10px 15px;
     border-radius: 10px;
     text-align: left; /* Align AI responses to the left */
@@ -48,6 +50,7 @@ h1 {
     border: 1px solid #ccc;
     border-radius: 5px;
     margin-bottom: 10px;
+    font-family: 'Courier New', Courier, monospace; /* Fixed width typeface */
 }
 
 #userInput:focus {
@@ -66,4 +69,14 @@ button[onclick="sendMessage()"] {
     font-size: 16px;
     border-radius: 5px;
     cursor: pointer;
+    transition: background-color 0.3s; /* Smooth transition effect */
 }
+
+button[onclick="sendMessage()"]:hover {
+    background-color: #b2b2b2; /* Light Grey on hover */
+}
+
+button[onclick="sendMessage()"]:active {
+    background-color: #6f6f6f; /* Dark Grey when clicked */
+}
+