minor styling updates

fleetbase · Apr 8, 2024 · cfb0bd6 · cfb0bd6
1 parent b02e485
commit cfb0bd6
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 7 deletions.
diff --git a/addon/components/chat-tray.hbs b/addon/components/chat-tray.hbs
@@ -15,19 +15,19 @@
                 </div>
                 <div class="flex flex-col">
                     {{#each this.channels as |channel|}}
-                        <div class="flex items-start px-4 py-3 border-t dark:border-gray-700 border-gray-200">
-                            <button type="button" class="flex flex-col flex-1 cursor-default" {{on "click" (fn this.openChannel channel)}}>
-                                <div class="font-bold mb-1">{{n-a channel.title "Untitled Chat"}}</div>
+                        <div class="chat-tray-channel-preview flex items-start px-4 py-3 border-t dark:border-gray-700 border-gray-200">
+                            <button type="button" class="chat-tray-channel-preview-btn flex flex-col flex-1 cursor-default" {{on "click" (fn this.openChannel channel)}}>
+                                <div class="chat-tray-channel-preview-title font-bold mb-1">{{n-a channel.title "Untitled Chat"}}</div>
                                 <div class="flex flex-row">
                                     <div class="w-10">
-                                        <Image src={{channel.last_message.sender.avatar_url}} @fallbackSrc={{config "defaultValues.userImage"}} alt={{channel.last_message.sender.name}} class="rounded-full shadow-sm w-8 h-8" />
+                                        <Image src={{channel.last_message.sender.avatar_url}} @fallbackSrc={{config "defaultValues.userImage"}} alt={{channel.last_message.sender.name}} class="chat-tray-channel-preview-avatar rounded-full shadow-sm w-8 h-8" />
                                     </div>
-                                    <div class="text-sm truncate dark:text-gray-200 text-gray-900">{{channel.last_message.content}}</div>
+                                    <div class="chat-tray-channel-preview-last-message text-sm truncate dark:text-gray-200 text-gray-900">{{channel.last_message.content}}</div>
                                 </div>
                             </button>
                             <div class="flex">
                                 <div class="btn-wrapper">
-                                    <button type="button" class="btn btn-danger btn-xs cursor-default" {{on "click" (fn this.removeChannel channel)}}>
+                                    <button type="button" class="chat-tray-channel-preview-close-channel-btn btn btn-danger btn-xs cursor-default" {{on "click" (fn this.removeChannel channel)}}>
                                         <FaIcon @icon="times" @size="sm" />
                                     </button>
                                 </div>

diff --git a/addon/components/chat-window.js b/addon/components/chat-window.js
@@ -128,7 +128,9 @@ export default class ChatWindowComponent extends Component {
         this.pendingAttachmentFiles = [];
 
         // save attachments
-        return all(attachments.map((_) => _.save()));
+        return all(attachments.map((_) => _.save())).then((response) => {
+            console.log(response);
+        });
     }
 
     @action closeChannel() {

diff --git a/addon/styles/components/chat.css b/addon/styles/components/chat.css
@@ -300,3 +300,15 @@
     display: flex;
     flex-direction: row;
 }
+
+.chat-tray-channel-preview:hover {
+    opacity: .5;
+}
+
+.chat-tray-channel-preview .chat-tray-channel-preview-last-message {
+    width: 285px;
+    max-width: 285px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}