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

Merge pull request #2260 from matrix-org/bwindels/rightpanelbelowheader

Browse source 
Redesign: move right panel below room/group header
This commit is contained in:
Bruno Windels 2018-11-02 14:12:24 +00:00 • committed by GitHub
commit 9546df609e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 554 additions and 627 deletions
Download patch file Download diff file Expand all files Collapse all files

10
res/css/structures/_GroupView.scss
View file

@ -15,10 +15,6 @@ limitations under the License.
*/
.mx_GroupView {
max-width: 960px;
width: 100%;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
overflow: hidden;
@ -29,7 +25,6 @@ limitations under the License.
}
.mx_GroupView_header {
max-width: 960px;
min-height: 70px;
align-items: center;
display: flex;
@ -162,6 +157,11 @@ limitations under the License.
line-height: 2em;
}
.mx_GroupView > .mx_MainSplit {
flex: 1;
display: flex;
}
.mx_GroupView_body {
flex-grow: 1;
}

5
res/css/structures/_MatrixChat.scss
View file

@ -69,7 +69,8 @@ limitations under the License.
transform: translateX(-50%);
}
.mx_MatrixChat .mx_MatrixChat_middlePanel {
/* not the left panel, and not the resize handle, so the roomview/groupview/... */
.mx_MatrixChat > :not(.mx_LeftPanel_container):not(.mx_ResizeHandle) {
background-color: $primary-bg-color;
flex: 1;
@ -81,8 +82,6 @@ limitations under the License.
*/
overflow-x: auto;
display: flex;
/* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari
needed height 100% all the way down to the HomePage. Height does not
have to be auto, empirically.

24
res/css/structures/_RoomView.scss
View file

@ -16,20 +16,10 @@ limitations under the License.
.mx_RoomView {
word-wrap: break-word;
position: relative;
display: flex;
width: 100%;
flex-direction: column;
}
.mx_RoomView .mx_RoomHeader {
order: 1;
flex: 0 0 52px;
}
.mx_RoomView_fileDropTarget {
min-width: 0px;
width: 100%;
@ -62,15 +52,11 @@ limitations under the License.
}
.mx_RoomView_auxPanel {
order: 2;
min-width: 0px;
width: 100%;
margin: 0px auto;
overflow: auto;
border-bottom: 1px solid $primary-hairline-color;
flex: 0 0 auto;
}
@ -79,13 +65,17 @@ limitations under the License.
}
.mx_RoomView_body {
order: 3;
.mx_RoomView .mx_MainSplit {
flex: 1 1 0;
flex-direction: column;
display: flex;
}
.mx_RoomView_body {
display: flex;
flex-direction: column;
flex: 1;
}
.mx_RoomView_body .mx_RoomView_topUnreadMessagesBar {
order: 1;
}