mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Make side-bar responsive

Browse source 
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-05-26 22:23:09 +05:30
parent 9ac415fa4f
commit eab6ca3baf
1 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/platform/web/ui/css/layout.css
View file

@ -72,7 +72,7 @@ the layout viewport up without resizing it when the keyboard shows */
.middle .close-middle { display: none; } .middle .close-middle { display: none; }
/* mobile layout */ /* mobile layout */
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
.SessionView:not(.middle-shown) { .SessionView:not(.middle-shown, .SideBarActive) {
grid-template: grid-template:
"status" auto "status" auto
"left" 1fr / "left" 1fr /
@ -86,8 +86,17 @@ the layout viewport up without resizing it when the keyboard shows */
1fr; 1fr;
} }
.SessionView.SideBarActive{
grid-template:
"status" auto
"right" 1fr /
1fr;
}
.SessionView:not(.middle-shown) .room-placeholder { display: none; } .SessionView:not(.middle-shown) .room-placeholder { display: none; }
.SessionView.middle-shown .LeftPanel { display: none; } .SessionView.middle-shown .LeftPanel { display: none; }
.SessionView.SideBarActive .middle { display: none; }
/* show back button */ /* show back button */
.middle .close-middle { display: block !important; } .middle .close-middle { display: block !important; }