imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add maximise widget functionality (#7098)

Browse source 
Co-authored-by: J. Ryan Stinnett <jryans@gmail.com>
This commit is contained in:
Timo 2021-11-16 15:43:18 +01:00 • committed by GitHub
parent 2f4f3f2a8c
commit 556cfc7ed8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 418 additions and 233 deletions
Download patch file Download diff file Expand all files Collapse all files

4
res/css/views/dialogs/_HostSignupDialog.scss
View file

@ -78,7 +78,7 @@ limitations under the License.
}
.mx_HostSignup_maximize_button {
mask: url('$(res)/img/feather-customised/maximise.svg');
mask: url("$(res)/img/element-icons/maximise-expand.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
@ -92,7 +92,7 @@ limitations under the License.
}
.mx_HostSignup_minimize_button {
mask: url('$(res)/img/feather-customised/minimise.svg');
mask: url("$(res)/img/element-icons/minimise-collapse.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;

5
res/css/views/elements/_ResizeHandle.scss
View file

@ -32,11 +32,6 @@ limitations under the License.
cursor: row-resize;
}
.mx_MatrixChat > .mx_ResizeHandle.mx_ResizeHandle_horizontal {
margin: 0 -10px 0 0;
padding: 0 8px 0 0;
}
.mx_ResizeHandle.mx_ResizeHandle_horizontal > div {
width: 1px;
height: 100%;

8
res/css/views/messages/_ViewSourceEvent.scss
View file

@ -29,19 +29,19 @@ limitations under the License.
}
.mx_ViewSourceEvent_toggle {
width: 12px;
mask-repeat: no-repeat;
mask-position: 0 center;
mask-size: auto 12px;
width: 12px;
visibility: hidden;
background-color: $accent;
mask-image: url('$(res)/img/feather-customised/maximise.svg');
mask-image: url("$(res)/img/element-icons/maximise-expand.svg");
}
&.mx_ViewSourceEvent_expanded .mx_ViewSourceEvent_toggle {
mask-position: 0 bottom;
margin-bottom: 7px;
mask-image: url('$(res)/img/feather-customised/minimise.svg');
margin-bottom: 5px;
mask-image: url("$(res)/img/element-icons/minimise-collapse.svg");
}
}

20
res/css/views/right_panel/_RoomSummaryCard.scss
View file

@ -133,6 +133,8 @@ limitations under the License.
}
.mx_RoomSummaryCard_app_pinToggle,
.mx_RoomSummaryCard_app_maximise,
.mx_RoomSummaryCard_app_minimise,
.mx_RoomSummaryCard_app_options {
position: absolute;
top: 0;
@ -174,6 +176,21 @@ limitations under the License.
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
}
}
.mx_RoomSummaryCard_app_maximise {
right: 48px;
&::before {
mask-size: 14px;
mask-image: url("$(res)/img/element-icons/maximise-expand.svg");
}
}
.mx_RoomSummaryCard_app_minimise {
right: 48px;
&::before {
mask-size: 14px;
mask-image: url("$(res)/img/element-icons/minimise-collapse.svg");
background-color: $accent;
}
}
.mx_RoomSummaryCard_app_options {
right: 48px;
@ -182,6 +199,9 @@ limitations under the License.
&::before {
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
}
&.mx_RoomSummaryCard_maximised_widget {
right: 72px;
}
}
&.mx_RoomSummaryCard_Button_pinned {

2
res/css/views/right_panel/_WidgetCard.scss
View file

@ -20,6 +20,8 @@ limitations under the License.
.mx_AppTileFullWidth {
max-width: unset;
width: auto !important;
margin: 0px $container-border-width 0px $container-border-width;
height: 100%;
border: 0;
}

38
res/css/views/rooms/_AppsDrawer.scss
View file

@ -18,11 +18,12 @@ limitations under the License.
$MiniAppTileHeight: 200px;
.mx_AppsDrawer {
margin: 5px 5px 5px 18px;
margin: 5px;
position: relative;
display: flex;
flex-direction: column;
overflow: hidden;
flex-grow: 1;
.mx_AppsContainer_resizerHandleContainer {
width: 100%;
@ -100,11 +101,11 @@ $MiniAppTileHeight: 200px;
min-height: 0;
.mx_AppTile:first-of-type {
border-left-width: 8px;
border-left-width: $container-border-width;
border-radius: 10px 0 0 10px;
}
.mx_AppTile:last-of-type {
border-right-width: 8px;
border-right-width: $container-border-width;
border-radius: 0 10px 10px 0;
}
@ -142,7 +143,7 @@ $MinWidth: 240px;
.mx_AppTile {
width: 50%;
min-width: $MinWidth;
border: 8px solid $widget-menu-bar-bg-color;
border: $container-border-width solid $widget-menu-bar-bg-color;
border-left-width: 5px;
border-right-width: 5px;
display: flex;
@ -155,7 +156,7 @@ $MinWidth: 240px;
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: $container-border-width solid $widget-menu-bar-bg-color;
border-radius: 8px;
display: flex;
flex-direction: column;
@ -224,15 +225,28 @@ $MinWidth: 240px;
mask-position: 0 center;
mask-size: auto 12px;
background-color: $topleftmenu-color;
margin: 0 3px;
}
margin: 0 5px;
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_popout {
mask-image: url('$(res)/img/feather-customised/widget/external-link.svg');
}
&.mx_AppTileMenuBar_iconButton_minWidget {
width: 10px;
height: 12px;
mask-size: auto 10px;
mask-image: url("$(res)/img/element-icons/minimise-collapse.svg");
}
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_menu {
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
&.mx_AppTileMenuBar_iconButton_maxWidget {
width: 11px;
height: 11px;
mask-image: url("$(res)/img/element-icons/maximise-expand.svg");
}
&.mx_AppTileMenuBar_iconButton_popout {
mask-image: url('$(res)/img/feather-customised/widget/external-link.svg');
}
&.mx_AppTileMenuBar_iconButton_menu {
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
}
}
.mx_AppTileBody {

4
res/css/views/rooms/_EventTile.scss
View file

@ -546,13 +546,13 @@ $left-gutter: 64px;
mask-size: 75%;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url($collapse-button-url);
mask-image: url("$(res)/img/element-icons/minimise-collapse.svg");
}
.mx_EventTile_expandButton {
mask-size: 75%;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url($expand-button-url);
mask-image: url("$(res)/img/element-icons/maximise-expand.svg");
}
.mx_EventTile_body .mx_EventTile_pre_container:focus-within .mx_EventTile_copyButton,