Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-15 12:45:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Iterate on Widget icons and resizing handles

Browse Source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-10-13 15:56:53 +01:00
parent a1d25efceb
commit ba21c6ed36
3 changed files with 24 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
res/css/views/rooms/_AppsDrawer.scss
View File

@ -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;
}
}
}

5
res/img/element-icons/room/default_video.svg Normal file
View File

@ -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>
Side by Side

After

Width:  |  Height:  |  Size: 544 B

4
src/components/views/avatars/WidgetAvatar.tsx
View File

@ -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")];