Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/feat/room-list-widgets
Conflicts: src/components/views/elements/AppTile.js
This commit is contained in:
Michael Telatynski
commit
4e12aeca9e
60 changed files with 1357 additions and 1128 deletions
|
|
@ -52,11 +52,11 @@
|
|||
@import "./views/avatars/_DecoratedRoomAvatar.scss";
|
||||
@import "./views/avatars/_MemberStatusMessageAvatar.scss";
|
||||
@import "./views/avatars/_PulsedAvatar.scss";
|
||||
@import "./views/avatars/_WidgetAvatar.scss";
|
||||
@import "./views/context_menus/_IconizedContextMenu.scss";
|
||||
@import "./views/context_menus/_MessageContextMenu.scss";
|
||||
@import "./views/context_menus/_StatusMessageContextMenu.scss";
|
||||
@import "./views/context_menus/_TagTileContextMenu.scss";
|
||||
@import "./views/context_menus/_WidgetContextMenu.scss";
|
||||
@import "./views/dialogs/_AddressPickerDialog.scss";
|
||||
@import "./views/dialogs/_Analytics.scss";
|
||||
@import "./views/dialogs/_BugReportDialog.scss";
|
||||
|
|
|
|||
|
|
@ -79,7 +79,6 @@ limitations under the License.
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
.mx_MatrixChat > .mx_LeftPanel2:hover + .mx_ResizeHandle_horizontal,
|
||||
.mx_MatrixChat > .mx_ResizeHandle_horizontal:hover {
|
||||
position: relative;
|
||||
|
||||
|
|
|
|||
|
|
@ -230,6 +230,10 @@ limitations under the License.
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&.mx_UserMenu_contextMenu_hostingLink {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_IconizedContextMenu_icon {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
/*
|
||||
Copyright 2019 The Matrix.org Foundaction C.I.C.
|
||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
|
|
@ -14,23 +14,6 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_WidgetContextMenu {
|
||||
padding: 6px;
|
||||
|
||||
.mx_WidgetContextMenu_option {
|
||||
padding: 3px 6px 3px 6px;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.mx_WidgetContextMenu_separator {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
border-bottom-style: none;
|
||||
border-left-style: none;
|
||||
border-right-style: none;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
border-color: $menu-border-color;
|
||||
}
|
||||
.mx_WidgetAvatar {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
|
@ -128,6 +128,13 @@ limitations under the License.
|
|||
mask-size: 20px;
|
||||
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||
}
|
||||
|
||||
&.mx_AccessibleButton_disabled {
|
||||
padding-right: 12px;
|
||||
&::after {
|
||||
content: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -110,28 +110,107 @@ limitations under the License.
|
|||
|
||||
.mx_RoomSummaryCard_appsGroup {
|
||||
.mx_RoomSummaryCard_Button {
|
||||
padding-left: 12px;
|
||||
// this button is special so we have to override some of the original styling
|
||||
// as we will be applying it in its children
|
||||
padding: 0;
|
||||
height: auto;
|
||||
color: $tertiary-fg-color;
|
||||
|
||||
span {
|
||||
color: $primary-fg-color;
|
||||
.mx_RoomSummaryCard_icon_app {
|
||||
padding: 10px 48px 10px 12px; // based on typical mx_RoomSummaryCard_Button padding
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
|
||||
.mx_BaseAvatar_image {
|
||||
vertical-align: top;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
span {
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: top;
|
||||
margin-right: 12px;
|
||||
border-radius: 4px;
|
||||
.mx_RoomSummaryCard_app_pinToggle,
|
||||
.mx_RoomSummaryCard_app_options {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 100%; // to give bigger interactive zone
|
||||
width: 24px;
|
||||
padding: 12px 4px;
|
||||
box-sizing: border-box;
|
||||
min-width: 24px; // prevent flexbox crushing
|
||||
|
||||
&:hover {
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
top: 8px; // equal to padding-top of parent
|
||||
left: 0;
|
||||
border-radius: 12px;
|
||||
background-color: rgba(141, 151, 165, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: 16px;
|
||||
background-color: $icon-button-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_app_pinToggle {
|
||||
right: 24px;
|
||||
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_app_options {
|
||||
right: 48px;
|
||||
display: none;
|
||||
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
|
||||
}
|
||||
}
|
||||
|
||||
&.mx_RoomSummaryCard_Button_pinned {
|
||||
&::after {
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_app_pinToggle::before {
|
||||
background-color: $accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.mx_RoomSummaryCard_icon_app {
|
||||
padding-right: 72px;
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_app_options {
|
||||
display: unset;
|
||||
}
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_icon_app_pinned::after {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
|
||||
background-color: $accent-color;
|
||||
transform: unset;
|
||||
&::after {
|
||||
top: 8px; // re-align based on the height change
|
||||
pointer-events: none; // pass through to the real button
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -24,34 +24,35 @@ limitations under the License.
|
|||
border: 0;
|
||||
}
|
||||
|
||||
&.mx_WidgetCard_noEdit {
|
||||
.mx_AccessibleButton_kind_secondary {
|
||||
margin: 0 12px;
|
||||
.mx_BaseCard_header {
|
||||
display: inline-flex;
|
||||
|
||||
&:first-child {
|
||||
// expand the Pin to room primary action
|
||||
flex-grow: 1;
|
||||
}
|
||||
& > h2 {
|
||||
margin-right: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_WidgetCard_optionsButton {
|
||||
position: relative;
|
||||
height: 18px;
|
||||
width: 26px;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
.mx_WidgetCard_optionsButton {
|
||||
position: relative;
|
||||
margin-right: 44px;
|
||||
height: 20px;
|
||||
top: 6px;
|
||||
left: 20px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
|
||||
background-color: $secondary-fg-color;
|
||||
width: 20px;
|
||||
min-width: 20px; // prevent crushing by the flexbox
|
||||
padding: 0;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
top: 0;
|
||||
left: 4px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
|
||||
background-color: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -47,53 +47,100 @@ $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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AppsContainer_resizer {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.mx_AppsContainer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
margin-bottom: 8px;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
|
||||
.mx_AppTile:first-of-type {
|
||||
border-left-width: 8px;
|
||||
border-radius: 10px 0 0 10px;
|
||||
}
|
||||
.mx_AppTile:last-of-type {
|
||||
border-right-width: 8px;
|
||||
border-radius: 0 10px 10px 0;
|
||||
}
|
||||
|
||||
.mx_ResizeHandle_horizontal {
|
||||
position: relative;
|
||||
|
||||
> div {
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AppsDrawer_minimised .mx_AppsContainer {
|
||||
// override the re-resizable inline styles
|
||||
height: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
// TODO this should be 300px but that's too large
|
||||
$MinWidth: 240px;
|
||||
|
||||
.mx_AddWidget_button {
|
||||
order: 2;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
margin: -3px auto 5px 0;
|
||||
color: $accent-color;
|
||||
font-size: $font-12px;
|
||||
.mx_AppsDrawer_2apps .mx_AppTile {
|
||||
width: 50%;
|
||||
|
||||
&:nth-child(3) {
|
||||
flex-grow: 1;
|
||||
width: 0 !important;
|
||||
min-width: $MinWidth !important;
|
||||
}
|
||||
}
|
||||
.mx_AppsDrawer_3apps .mx_AppTile {
|
||||
width: 33%;
|
||||
|
||||
&:nth-child(3) {
|
||||
flex-grow: 1;
|
||||
width: 0 !important;
|
||||
min-width: $MinWidth !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AppTile {
|
||||
width: 50%;
|
||||
border: 5px solid $widget-menu-bar-bg-color;
|
||||
border-radius: 4px;
|
||||
min-width: $MinWidth;
|
||||
border: 8px solid $widget-menu-bar-bg-color;
|
||||
border-left-width: 5px;
|
||||
border-right-width: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
& + .mx_AppTile {
|
||||
margin-left: 5px;
|
||||
}
|
||||
box-sizing: border-box;
|
||||
background-color: $widget-menu-bar-bg-color;
|
||||
}
|
||||
|
||||
.mx_AppTileFullWidth {
|
||||
width: 100%;
|
||||
width: 100% !important; // to override the inline style set by the resizer
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 5px solid $widget-menu-bar-bg-color;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: $widget-menu-bar-bg-color;
|
||||
}
|
||||
|
||||
.mx_AppTile_mini {
|
||||
|
|
@ -105,12 +152,6 @@ $MiniAppTileHeight: 200px;
|
|||
height: $MiniAppTileHeight;
|
||||
}
|
||||
|
||||
.mx_AppTile.mx_AppTile_minimised,
|
||||
.mx_AppTileFullWidth.mx_AppTile_minimised,
|
||||
.mx_AppTile_mini.mx_AppTile_minimised {
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.mx_AppTile .mx_AppTile_persistedWrapper,
|
||||
.mx_AppTileFullWidth .mx_AppTile_persistedWrapper,
|
||||
.mx_AppTile_mini .mx_AppTile_persistedWrapper {
|
||||
|
|
@ -130,19 +171,20 @@ $MiniAppTileHeight: 200px;
|
|||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar_expanded {
|
||||
padding-bottom: 5px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBarTitle {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
line-height: 20px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
.mx_WidgetAvatar {
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBarTitle > :last-child {
|
||||
|
|
@ -166,37 +208,20 @@ $MiniAppTileHeight: 200px;
|
|||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_minimise {
|
||||
mask-image: url('$(res)/img/feather-customised/widget/minimise.svg');
|
||||
background-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_maximise {
|
||||
mask-image: url('$(res)/img/feather-customised/widget/maximise.svg');
|
||||
background-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_popout {
|
||||
mask-image: url('$(res)/img/feather-customised/widget/external-link.svg');
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_menu {
|
||||
mask-image: url('$(res)/img/icon_context.svg');
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBarWidgetDelete {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBarWidget:hover {
|
||||
border: 1px solid $primary-fg-color;
|
||||
border-radius: 2px;
|
||||
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
|
||||
}
|
||||
|
||||
.mx_AppTileBody {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
background-color: $widget-body-bg-color;
|
||||
}
|
||||
|
||||
.mx_AppTileBody_mini {
|
||||
|
|
@ -231,7 +256,6 @@ $MiniAppTileHeight: 200px;
|
|||
|
||||
.mx_AppPermissionWarning {
|
||||
text-align: center;
|
||||
background-color: $widget-menu-bar-bg-color;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
|
|
@ -296,6 +320,10 @@ $MiniAppTileHeight: 200px;
|
|||
font-weight: bold;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
// match bg of border so that the cut corners have the right fill
|
||||
background-color: $widget-body-bg-color !important;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.mx_AppLoading .mx_Spinner {
|
||||
|
|
@ -323,10 +351,6 @@ $MiniAppTileHeight: 200px;
|
|||
display: none;
|
||||
}
|
||||
|
||||
.mx_AppsDrawer_minimised .mx_AppsContainer_resizerHandle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Avoid apptile iframes capturing mouse event focus when resizing */
|
||||
.mx_AppsDrawer_resizing iframe {
|
||||
pointer-events: none;
|
||||
|
|
|
|||
|
|
@ -241,6 +241,13 @@ limitations under the License.
|
|||
width: 26px;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_appsButton::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/apps.svg');
|
||||
}
|
||||
.mx_RoomHeader_appsButton_highlight::before {
|
||||
background-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_searchButton::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/search-inset.svg');
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,6 +16,10 @@
|
|||
border-bottom: none;
|
||||
}
|
||||
|
||||
.mx_AppTileMenuBar {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
iframe {
|
||||
// Sticker picker depends on the fixed height previously used for all tiles
|
||||
height: 273px;
|
||||
|
|
|
|||
6
res/img/element-icons/room/apps.svg
Normal file
6
res/img/element-icons/room/apps.svg
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="14" y="2" width="8" height="8" rx="2" fill="#0DBD8B"/>
|
||||
<rect x="14" y="14" width="8" height="8" rx="2" fill="#0DBD8B"/>
|
||||
<rect x="2" y="14" width="8" height="8" rx="2" fill="#0DBD8B"/>
|
||||
<rect x="2" y="2" width="8" height="8" rx="2" fill="#0DBD8B"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 359 B |
|
|
@ -1,11 +1,21 @@
|
|||
<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="20" height="20" fill="url(#paint0_linear)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 3V9.5H0.00390625L0.00390625 10.5H2V17H0.00390625L0.00390625 18H2V20H3V18H9.5039V20.0005H10.5039V18H17V20H18V18H20.0039V17H18V10.5H20.0039V9.5H18V3H20.0039V2H18V0L17 0V2H10.5039V0.000488281L9.5039 0.000488281V2H3V0L2 0V2H0.00390625L0.00390625 3H2ZM17 3H10.5039V9.5H17V3ZM17 10.5H10.5039V17H17V10.5ZM9.5039 10.5V17H3V10.5H9.5039ZM9.5039 3V9.5H3V3H9.5039Z" fill="white" fill-opacity="0.3" style="mix-blend-mode:lighten"/>
|
||||
<circle opacity="0.8" cx="10.0039" cy="10" r="7.5" stroke="white"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="10" y1="0" x2="10" y2="20" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#60A6FF"/>
|
||||
<stop offset="1" stop-color="#418DED"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0)">
|
||||
<rect width="20" height="20" rx="4" fill="url(#paint0_linear)"/>
|
||||
<path d="M2.49609 0V20" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<path d="M20 2.5L1.60531e-06 2.5" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<path d="M20 10L1.60531e-06 10" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<path d="M20 17.5H1.60531e-06" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<path d="M10 0.000488281V20.0005" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<path d="M17.4961 0V20" stroke="white" stroke-opacity="0.5" style="mix-blend-mode:lighten"/>
|
||||
<circle opacity="0.8" cx="10" cy="10" r="7.5" stroke="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="10" y1="0" x2="10" y2="20" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#60A6FF"/>
|
||||
<stop offset="1" stop-color="#418DED"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0">
|
||||
<rect width="20" height="20.0005" rx="4" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 900 B After Width: | Height: | Size: 1.3 KiB |
|
|
@ -1,6 +1,6 @@
|
|||
<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1.99461" y="1.00002" width="18" height="18" rx="2" fill="white" stroke="#FF4B55" stroke-width="2"/>
|
||||
<rect x="2.96777" y="2" width="16.9843" height="5" fill="#FF4B55"/>
|
||||
<rect x="4.96533" y="9" width="2.99723" height="3" rx="0.25" fill="#FF4B55"/>
|
||||
<rect x="11.9585" y="13.0005" width="2.99723" height="3" rx="0.25" fill="#FF4B55"/>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="20" height="20" rx="4" fill="#FF4B55"/>
|
||||
<path d="M2 7H18V16C18 17.1046 17.1046 18 16 18H4C2.89543 18 2 17.1046 2 16V7Z" fill="white"/>
|
||||
<rect x="3.96826" y="8.99951" width="2.99723" height="3" rx="0.25" fill="#FF4B55"/>
|
||||
<rect x="10.9614" y="13" width="2.99723" height="3" rx="0.25" fill="#FF4B55"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 442 B After Width: | Height: | Size: 430 B |
|
|
@ -1,5 +1,5 @@
|
|||
<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1.49609" y="0.500488" width="19" height="19" rx="3.5" fill="#17191C" stroke="#17191C"/>
|
||||
<path d="M18.9961 10.0005C18.9961 14.4188 15.4144 18.0005 10.9961 18.0005C6.57782 18.0005 2.99609 14.4188 2.99609 10.0005C2.99609 5.58221 6.57782 2.00049 10.9961 2.00049C15.4144 2.00049 18.9961 5.58221 18.9961 10.0005Z" fill="white"/>
|
||||
<path d="M10.9961 6.00049V9.81299L13.4961 11.5005" stroke="black" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="1" y="1" width="18" height="18" rx="3" fill="#17191C" stroke="#17191C" stroke-width="2"/>
|
||||
<path d="M18 10C18 14.4183 14.4183 18 10 18C5.58172 18 2 14.4183 2 10C2 5.58172 5.58172 2 10 2C14.4183 2 18 5.58172 18 10Z" fill="white"/>
|
||||
<path d="M10 6V9.8125L12.5 11.5" stroke="black" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 569 B After Width: | Height: | Size: 469 B |
|
|
@ -1,4 +1,4 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="-0.000976562" y="0.000488281" width="20" height="20" rx="4" fill="#FCC639"/>
|
||||
<path d="M1.99902 7.00049H17.999V16.5005C17.999 17.3289 17.3274 18.0005 16.499 18.0005H3.49902C2.6706 18.0005 1.99902 17.3289 1.99902 16.5005V7.00049Z" fill="white"/>
|
||||
<rect width="20" height="20" rx="4" fill="#FCC639"/>
|
||||
<path d="M2 7H18V16C18 17.1046 17.1046 18 16 18H4C2.89543 18 2 17.1046 2 16V7Z" fill="white"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 364 B After Width: | Height: | Size: 259 B |
5
res/img/element-icons/room/default_video.svg
Normal file
5
res/img/element-icons/room/default_video.svg
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="20" height="20" rx="4" fill="#5ABFF2"/>
|
||||
<path d="M3 7.875C3 6.83947 3.83947 6 4.875 6H11.1875C12.223 6 13.0625 6.83947 13.0625 7.875V12.875C13.0625 13.9105 12.223 14.75 11.1875 14.75H4.875C3.83947 14.75 3 13.9105 3 12.875V7.875Z" fill="white"/>
|
||||
<path d="M14.375 8.44644L16.1208 7.11039C16.4806 6.83502 17 7.09158 17 7.54468V13.0396C17 13.5199 16.4251 13.7669 16.0767 13.4363L14.375 11.8214V8.44644Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 543 B |
|
|
@ -1,3 +0,0 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 3.79086 3.79086 2 6 2H18C20.2091 2 22 3.79086 22 6V18C22 20.2091 20.2091 22 18 22H6C3.79086 22 2 20.2091 2 18V6ZM11 8C11 9.65685 9.65685 11 8 11C6.34315 11 5 9.65685 5 8C5 6.34315 6.34315 5 8 5C9.65685 5 11 6.34315 11 8ZM8 19C9.65685 19 11 17.6569 11 16C11 14.3431 9.65685 13 8 13C6.34315 13 5 14.3431 5 16C5 17.6569 6.34315 19 8 19ZM19 16C19 17.6569 17.6569 19 16 19C14.3431 19 13 17.6569 13 16C13 14.3431 14.3431 13 16 13C17.6569 13 19 14.3431 19 16ZM16 11C17.6569 11 19 9.65685 19 8C19 6.34315 17.6569 5 16 5C14.3431 5 13 6.34315 13 8C13 9.65685 14.3431 11 16 11Z" fill="black"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 742 B |
|
|
@ -1,5 +0,0 @@
|
|||
<svg width="3" height="15" viewBox="0 0 3 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 3C2.32843 3 3 2.32843 3 1.5C3 0.671573 2.32843 0 1.5 0C0.671573 0 0 0.671573 0 1.5C0 2.32843 0.671573 3 1.5 3Z" fill="#9FA9BA"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 9C2.32843 9 3 8.32843 3 7.5C3 6.67157 2.32843 6 1.5 6C0.671573 6 0 6.67157 0 7.5C0 8.32843 0.671573 9 1.5 9Z" fill="#9FA9BA"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 15C2.32843 15 3 14.3284 3 13.5C3 12.6716 2.32843 12 1.5 12C0.671573 12 0 12.6716 0 13.5C0 14.3284 0.671573 15 1.5 15Z" fill="#9FA9BA"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 655 B |
|
|
@ -131,6 +131,7 @@ $notice-secondary-color: $roomlist-header-color;
|
|||
$panel-divider-color: transparent;
|
||||
|
||||
$widget-menu-bar-bg-color: $header-panel-bg-color;
|
||||
$widget-body-bg-color: rgba(141, 151, 165, 0.2);
|
||||
|
||||
// event tile lifecycle
|
||||
$event-sending-color: $text-secondary-color;
|
||||
|
|
|
|||
|
|
@ -126,6 +126,7 @@ $roomtile-selected-bg-color: #1A1D23;
|
|||
$panel-divider-color: $header-panel-border-color;
|
||||
|
||||
$widget-menu-bar-bg-color: $header-panel-bg-color;
|
||||
$widget-body-bg-color: #1A1D23;
|
||||
|
||||
// event tile lifecycle
|
||||
$event-sending-color: $text-secondary-color;
|
||||
|
|
|
|||
|
|
@ -208,6 +208,7 @@ $panel-divider-color: #dee1f3;
|
|||
// ********************
|
||||
|
||||
$widget-menu-bar-bg-color: $secondary-accent-color;
|
||||
$widget-body-bg-color: #fff;
|
||||
|
||||
// ********************
|
||||
|
||||
|
|
|
|||
|
|
@ -208,6 +208,7 @@ $pinned-color: $notice-secondary-color;
|
|||
// ********************
|
||||
|
||||
$widget-menu-bar-bg-color: $secondary-accent-color;
|
||||
$widget-body-bg-color: #FFF;
|
||||
|
||||
// ********************
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue