From 145b5b728b0d884cabb316802677fb330cb756bc Mon Sep 17 00:00:00 2001
From: Raven Scott <raven@ssh.surf>
Date: Thu, 13 Jun 2024 05:24:44 -0400
Subject: [PATCH] Better style for the side bar + removing alert on copy

---
 index.html |  2 +-
 style.css  | 86 +++++++++++++++++++++++++++++++++++++++++++++++++++---
 2 files changed, 83 insertions(+), 5 deletions(-)

diff --git a/index.html b/index.html
index 2a8d905..d918404 100644
--- a/index.html
+++ b/index.html
@@ -91,7 +91,7 @@
           if (chatRoomTopic) {
             const topic = chatRoomTopic.innerText;
             navigator.clipboard.writeText(topic).then(() => {
-              alert('Topic copied to clipboard!');
+              console.log('Topic copied to clipboard:', topic);
             }).catch(err => {
               console.error('Failed to copy topic:', err);
             });
diff --git a/style.css b/style.css
index 22f2c79..d7ac757 100644
--- a/style.css
+++ b/style.css
@@ -23,15 +23,15 @@ body {
     border-radius: 3px;
     text-decoration: none;
     cursor: pointer;
-  }
+}
 
-  .mini-button:hover {
+.mini-button:hover {
     background-color: #0056b3;
-  }
+}
 
 .bold {
     font-weight: bold;
-  }
+}
 
 pear-ctrl[data-platform="darwin"] { float: right; margin-top: 4px; }
 
@@ -167,10 +167,12 @@ main {
     color: white;
     font-size: 14px;
     border-radius: 5px;
+    transition: background-color 0.3s ease, transform 0.3s ease;
 }
 
 #sidebar button:hover {
     background-color: #5b6eae;
+    transform: scale(1.05);
 }
 
 #remove-room-btn {
@@ -469,3 +471,79 @@ main {
     /* Removed circular border */
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
 }
+
+/* Updated Room List Styles */
+#room-list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+#room-list li {
+    padding: 10px;
+    margin-bottom: 10px;
+    background-color: #3a3f44;
+    border-radius: 5px;
+    cursor: pointer;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    transition: background-color 0.3s ease;
+}
+
+#room-list li:hover {
+    background-color: #4a5258;
+}
+
+#room-list li span {
+    flex: 1;
+}
+
+#room-list li .edit-icon,
+#room-list li .delete-icon {
+    margin-left: 10px;
+    color: #b0d944;
+    cursor: pointer;
+    transition: color 0.3s ease;
+}
+
+#room-list li .edit-icon:hover,
+#room-list li .delete-icon:hover {
+    color: #9ac831;
+}
+
+/* Style for Edit Mode Input Box */
+#room-list li input[type="text"] {
+    background-color: #2e2e2e;
+    border: 1px solid #b0d944;
+    border-radius: 5px;
+    color: #b0d944;
+    padding: 5px;
+    width: calc(100% - 40px); /* Adjusted width to fit inside the list item */
+    margin-right: 10px; /* Added margin to separate from icons */
+    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
+}
+
+#room-list li input[type="text"]:focus {
+    outline: none;
+    background-color: #3a3a3a;
+}
+
+/* Sidebar Button Style */
+#sidebar button {
+    width: 100%;
+    padding: 10px;
+    margin-bottom: 10px;
+    cursor: pointer;
+    background-color: #7289da;
+    border: none;
+    color: white;
+    font-size: 14px;
+    border-radius: 5px;
+    transition: background-color 0.3s ease, transform 0.3s ease;
+}
+
+#sidebar button:hover {
+    background-color: #5b6eae;
+    transform: scale(1.05);
+}