From f5685f45c7affcb8ae07763815c5527636912e1f Mon Sep 17 00:00:00 2001
From: Sebastian Castro <sebastian.castro@protonmail.com>
Date: Tue, 7 Apr 2020 18:47:36 +0200
Subject: [PATCH] css: various improvements

---
 src/static/css/pad.css                        |  1 +
 src/static/css/pad/popup.css                  | 22 ++++++++-----------
 src/static/css/pad/toolbar.css                |  4 ++--
 src/static/css/timeslider.css                 |  3 +++
 .../skins/colibris/src/components/form.css    |  1 +
 .../skins/colibris/src/components/popup.css   | 18 ++++++++-------
 .../skins/colibris/src/components/toolbar.css | 21 +++++-------------
 src/static/skins/colibris/src/layout.css      |  9 ++++++--
 8 files changed, 38 insertions(+), 41 deletions(-)

diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index ccdf8b3c2..30b9e1dd7 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -29,6 +29,7 @@ select {
   border: 1px solid #ccc;
   outline: none;
   width: 120px;
+  cursor: pointer;
 }
 
 .clear {
diff --git a/src/static/css/pad/popup.css b/src/static/css/pad/popup.css
index c8bf9e849..8d2681faf 100644
--- a/src/static/css/pad/popup.css
+++ b/src/static/css/pad/popup.css
@@ -65,23 +65,19 @@
 @media only screen and (max-width: 720px) {
   .popup {
     border-radius: 0;
-    left: 0;
-    right: 0;
-    max-height: 80vh;
+    top: 1rem;
+    margin: 0 !important;
+    right: 1rem !important;
+    left: 1rem !important;
     max-width: none !important;
   }
+  .popup-content {
+    max-height: 80vh;
+    overflow: auto;
+  }
   /* Move popup to the bottom, except popup linked to left toolbar, like hyperklink popup */
   .popup:not(.toolbar-popup) {
     top: auto;
-    bottom: 0;
-    border-radius: 6px 6px 0 0;
-    border: 1px solid #ccc;
-    border-bottom: none;
-    box-shadow: 0 -2px 4px #ddd;
-  }
-
-  .toolbar-popup {
-    left: 0 !important; /* overide javascript positionning */
-    right: 0 !important;
+    bottom: 1rem;
   }
 }
\ No newline at end of file
diff --git a/src/static/css/pad/toolbar.css b/src/static/css/pad/toolbar.css
index af85fc498..3d930e399 100644
--- a/src/static/css/pad/toolbar.css
+++ b/src/static/css/pad/toolbar.css
@@ -78,10 +78,10 @@
   padding-left: 3px;
 }
 .toolbar ul li[data-key=showusers] > a #online_count {
-  color: #777;
+  font-weight: bold;
   font-size: 11px;
   position: relative;
-  padding-left: 5px;
+  padding-left: 7px;
 }
 
 .toolbar #toolbar-overlay {
diff --git a/src/static/css/timeslider.css b/src/static/css/timeslider.css
index f0f713f16..264728c5c 100644
--- a/src/static/css/timeslider.css
+++ b/src/static/css/timeslider.css
@@ -2,6 +2,9 @@
   padding: 10px;
   display: block;
 }
+#innerdocbody {
+  margin: 0 auto;
+}
 
 .timeslider-bar {
   display: flex;
diff --git a/src/static/skins/colibris/src/components/form.css b/src/static/skins/colibris/src/components/form.css
index 2ea585e82..03504999f 100644
--- a/src/static/skins/colibris/src/components/form.css
+++ b/src/static/skins/colibris/src/components/form.css
@@ -2,6 +2,7 @@ input[type="text"], select {
   border-radius: 3px;
   box-shadow: none;
   border: none;
+  outline: 0;
 }
 
 input[type="text"] {
diff --git a/src/static/skins/colibris/src/components/popup.css b/src/static/skins/colibris/src/components/popup.css
index 626365ce9..3fac71eb2 100644
--- a/src/static/skins/colibris/src/components/popup.css
+++ b/src/static/skins/colibris/src/components/popup.css
@@ -27,14 +27,6 @@
   margin: 10px 0;
 }
 
-@media (max-width: 720px) {
-  .popup {
-    right: 0;
-    border-radius: 0 !important;
-    border: none !important;
-  }
-}
-
 .popup .dropdowns-container .dropdown-line {
   margin-top: 15px;
 }
@@ -45,3 +37,13 @@
 .popup .dropdowns-container select {
   min-width: 180px;
 }
+
+@media (max-width: 720px) {
+  .popup-content {
+    padding: 1rem;
+    box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), -1px 1px 16px 3px rgba(27, 39, 51, 0.12);
+  }
+  .popup .dropdowns-container select {
+    min-width: 0;
+  }
+}
diff --git a/src/static/skins/colibris/src/components/toolbar.css b/src/static/skins/colibris/src/components/toolbar.css
index 9b052864a..ce83a908e 100644
--- a/src/static/skins/colibris/src/components/toolbar.css
+++ b/src/static/skins/colibris/src/components/toolbar.css
@@ -34,21 +34,12 @@
 }
 
 .toolbar ul li.separator {
-  visibility: visible;
+  visibility: hidden;
   width: 1px;
   margin: 0 10px;
   position: relative;
 }
 
-.toolbar ul li.separator:after {
-  content: "";
-  position: absolute;
-  top: -25px;
-  height: 50px;
-  width: 1px;
-  background-color: var(--border-color);
-}
-
 .toolbar.condensed ul li {
   margin-left: 0;
 }
@@ -90,7 +81,7 @@
 
 .toolbar ul li[data-key=showusers] {
   margin: 0;
-  margin-left: 10px;
+  margin-left: 15px;
   width: 45px;
   height: 100%;
   background-color: var(--bg-color);
@@ -110,12 +101,10 @@
 }
 
 .toolbar.cropped .menu_left {
-  height: 35px;
+  height: 39px;
+  padding-top: 1px;
 }
 .toolbar .show-more-icon-btn {
-  height: 35px;
-  width: 35px;
-  line-height: 35px;
   font-size: 1.8rem;
   color: var(--primary-color);
 }
@@ -131,7 +120,7 @@
 @media (max-width: 720px) {
 
   .toolbar ul li {
-    margin: 5px 1px;
+    margin: 5px 2px;
   }
 
   .toolbar .menu_right {
diff --git a/src/static/skins/colibris/src/layout.css b/src/static/skins/colibris/src/layout.css
index 003c73bb1..f433e6bd3 100644
--- a/src/static/skins/colibris/src/layout.css
+++ b/src/static/skins/colibris/src/layout.css
@@ -37,18 +37,18 @@
 }
 
 
-@media (min-width: 999px) {
+@media (min-width: 1001px) {
   #outerdocbody {
     min-height: calc(100vh - 20px);
   }
 }
 @media (max-width:1000px) {
   #outerdocbody {
-    max-width: none;
     padding-top: 0;
   }
   #outerdocbody iframe, #outerdocbody > #innerdocbody {
     padding: 20px;
+    max-width: none;
     border-radius: 0;
   }
   #sidediv {
@@ -72,4 +72,9 @@
   }
   /* #sidediv is hidden at this size of screen */
 }
+@media only screen and (max-width: 720px) {
+  #editorcontainerbox {
+    margin-bottom: 39px; /* margin for bottom toolbar */
+  }
+}