mirrors/etherpad-lite
1
0
Fork 0
mirror of https://github.com/ether/etherpad-lite.git synced 2025-04-24 17:36:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

css: Improve toolbar responsiveness for small screen (#4322)

Browse source 
Until now, the "mobile layout" (with right toolbar on bottom of the screen) was displayed only when screen was smaller than 800px. It made the toolbar break for screen about 1000px when a lot of plugins are in the toolbar.
Now instead, we detect with javascript when the toolbar icons overflow the natural space available, and we switch in "mobile layout" in such case
This commit is contained in:
Sebastian Castro 2020-09-19 20:09:30 +02:00 • committed by GitHub
parent 299bd962b6
commit 12bd617f51
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 82 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/static/css/pad/layout.css
View file

@ -47,8 +47,6 @@ body {
width: 0; /* hide when the container is empty */
}
@media only screen and (max-width: 800px) {
#editorcontainerbox {
margin-bottom: 39px; /* Leave space for the bottom toolbar on mobile */
}
.mobile-layout #editorcontainerbox {
margin-bottom: 39px; /* Leave space for the bottom toolbar on mobile */
}