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

Add a minimized view to the new room list

Browse source 
This covers everything except breadcrumbs, as those are somewhat undecided from a design perspective.
This commit is contained in:
Travis Ralston 2020-06-11 14:39:28 -06:00
parent 2e04414331
commit 2c04a56784
10 changed files with 243 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

34
res/css/structures/_LeftPanel2.scss
View file

@ -138,4 +138,38 @@ $roomListMinimizedWidth: 50px;
display: flex;
}
}
// These styles override the defaults for the minimized (66px) layout
&.mx_LeftPanel2_minimized {
min-width: unset;
// We have to forcefully set the width to override the resizer's style attribute.
width: calc(68px + $tagPanelWidth) !important;
.mx_LeftPanel2_roomListContainer {
width: 68px;
.mx_LeftPanel2_userHeader {
.mx_LeftPanel2_headerRow {
justify-content: center;
}
.mx_LeftPanel2_userAvatarContainer {
margin-right: 0;
}
}
.mx_LeftPanel2_filterContainer {
// Organize the flexbox into a centered column layout
flex-direction: column;
justify-content: center;
.mx_LeftPanel2_exploreButton {
margin-left: 0;
margin-top: 8px;
background-color: transparent;
}
}
}
}
}

11
res/css/structures/_RoomSearch.scss
View file

@ -67,4 +67,15 @@ limitations under the License.
width: 0;
height: 0;
}
&.mx_RoomSearch_minimized {
border-radius: 32px;
height: auto;
width: auto;
padding: 8px;
.mx_RoomSearch_icon {
margin-left: 0;
}
}
}