From ba21c6ed366355ff4fb40b2581e9001b534d6122 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Tue, 13 Oct 2020 15:56:53 +0100
Subject: [PATCH] Iterate on Widget icons and resizing handles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 res/css/views/rooms/_AppsDrawer.scss          | 32 +++++++++----------
 res/img/element-icons/room/default_video.svg  |  5 +++
 src/components/views/avatars/WidgetAvatar.tsx |  4 ++-
 3 files changed, 24 insertions(+), 17 deletions(-)
 create mode 100644 res/img/element-icons/room/default_video.svg

diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss
index c96b6fde82..bbbfc21cd1 100644
--- a/res/css/views/rooms/_AppsDrawer.scss
+++ b/res/css/views/rooms/_AppsDrawer.scss
@@ -47,6 +47,22 @@ $MiniAppTileHeight: 200px;
             opacity: 0.8;
             background: $primary-fg-color;
         }
+
+        .mx_ResizeHandle_horizontal::before {
+            position: absolute;
+            left: 3px;
+            top: 50%;
+            transform: translate(0, -50%);
+
+            height: 64px; // to match width of the ones on roomlist
+            width: 4px;
+            border-radius: 4px;
+
+            content: ' ';
+
+            background-color: $primary-fg-color;
+            opacity: 0.8;
+        }
     }
 }
 
@@ -79,22 +95,6 @@ $MiniAppTileHeight: 200px;
         > div {
             width: 0;
         }
-
-        &:hover::before {
-            position: absolute;
-            left: 3px;
-            top: 50%;
-            transform: translate(0, -50%);
-
-            height: 64px; // to match width of the ones on roomlist
-            width: 4px;
-            border-radius: 4px;
-
-            content: ' ';
-
-            background-color: $primary-fg-color;
-            opacity: 0.8;
-        }
     }
 }
 
diff --git a/res/img/element-icons/room/default_video.svg b/res/img/element-icons/room/default_video.svg
new file mode 100644
index 0000000000..07b1084916
--- /dev/null
+++ b/res/img/element-icons/room/default_video.svg
@@ -0,0 +1,5 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.996094" width="20" height="20" rx="4" fill="#5ABFF2"/>
+<path d="M4 7.875C4 6.83947 4.83947 6 5.875 6H12.1875C13.223 6 14.0625 6.83947 14.0625 7.875V12.875C14.0625 13.9105 13.223 14.75 12.1875 14.75H5.875C4.83947 14.75 4 13.9105 4 12.875V7.875Z" fill="white"/>
+<path d="M15.375 8.44644L17.1208 7.11039C17.4806 6.83502 18 7.09158 18 7.54468V13.0396C18 13.5199 17.4251 13.7669 17.0767 13.4363L15.375 11.8214V8.44644Z" fill="white"/>
+</svg>
diff --git a/src/components/views/avatars/WidgetAvatar.tsx b/src/components/views/avatars/WidgetAvatar.tsx
index 10cca50c26..04cfce7670 100644
--- a/src/components/views/avatars/WidgetAvatar.tsx
+++ b/src/components/views/avatars/WidgetAvatar.tsx
@@ -31,7 +31,9 @@ const WidgetAvatar: React.FC<IProps> = ({ app, className, width = 20, height = 2
 
     let iconUrls = [require("../../../../res/img/element-icons/room/default_app.svg")];
     // heuristics for some better icons until Widgets support their own icons
-    if (app.type.includes("meeting") || app.type.includes("calendar")) {
+    if (app.type.includes("jitsi")) {
+        iconUrls = [require("../../../../res/img/element-icons/room/default_video.svg")];
+    } else if (app.type.includes("meeting") || app.type.includes("calendar")) {
         iconUrls = [require("../../../../res/img/element-icons/room/default_cal.svg")];
     } else if (app.type.includes("pad") || app.type.includes("doc") || app.type.includes("calc")) {
         iconUrls = [require("../../../../res/img/element-icons/room/default_doc.svg")];