mobile: More menu-related stuff moved to device-mobile.css.

Change-Id: I33df7cbfe4835caf2d9757e8f357f456b9d1e777
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/91474
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com>
Reviewed-by: Jan Holesovsky <kendy@collabora.com>
This commit is contained in:
Jan Holesovsky 2020-04-01 11:27:55 +02:00
parent f4c76b9f87
commit ebcd7816b4
2 changed files with 64 additions and 53 deletions

View file

@ -54,3 +54,64 @@ div#w2ui-overlay-actionbar.w2ui-overlay{
#document-header{
display: none !important;
}
/* Related to menubar.css */
.document-logo {
width: 35px;
height: 38px;
}
#document-titlebar {
display: none;
}
.document-title {
display: none;
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
display: none;
}
.main-menu-btn {
display: inline-block;
}
.main-nav {
position: absolute;
height: 0;
width: 100%;
top: 37px; /*set equal to toolbar up's height*/
margin: 0;
-webkit-overflow-scrolling: touch;
overflow: scroll;
z-index: 1010;
bottom: 34px !important;
background-color: #00000050;
}
#main-menu {
position: relative;
top: 0;
width: 70%;
float: right;
background-color: white;
height: 100%;
}
.writer-icon-img {
background-size: 35px 35px;
}
.calc-icon-img {
background-size: 35px 35px;
}
.impress-icon-img {
background-size: 35px 35px;
}
#document-name-input {
display: none;
}

View file

@ -256,65 +256,15 @@
background-position: bottom;
}
/* FIXME remove this @media; but for the moment doing so breaks the cypress
* tests.
*/
@media (max-width: 767px), (max-device-height: 767px) {
.document-logo {
width: 35px;
height: 38px;
}
#document-titlebar {
display: none;
}
.document-title {
display: none;
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
display: none;
}
.main-menu-btn {
display: inline-block;
}
.main-nav {
position: absolute;
height: 0;
width: 100%;
top: 37px; /*set equal to toolbar up's height*/
margin: 0;
-webkit-overflow-scrolling: touch;
overflow: scroll;
z-index: 1010;
bottom: 34px !important;
background-color: #00000050;
}
#main-menu {
position: relative;
top: 0;
width: 70%;
float: right;
background-color: white;
height: 100%;
}
.writer-icon-img {
background-size: 35px 35px;
}
.calc-icon-img {
background-size: 35px 35px;
}
.impress-icon-img {
background-size: 35px 35px;
}
#document-name-input {
display: none;
}
}