Merge branch 'staging' of github.com:xwiki-labs/cryptpad into staging

customize.dist/src/less2/include/sidebar-layout.less

@@ -1,6 +1,7 @@
 @import (reference) "/customize/src/less2/include/colortheme-all.less";
 @import (reference) "/customize/src/less2/include/leftside-menu.less";
 @import (reference) "/customize/src/less2/include/buttons.less";
+@import (reference) "/customize/src/less2/include/browser.less";
 
 @sidebar_button-width: 400px;
 
@@ -73,6 +74,7 @@
             padding: 5px 20px;
             color: @rightside-color;
             overflow: auto;
+            padding-bottom: 200px;
 
             // Following rules are only in settings
             .cp-sidebarlayout-element {
@@ -96,7 +98,7 @@
                     }
                 }
                 margin-bottom: 20px;
-            .buttons_main();
+                .buttons_main();
             }
             [type="text"], [type="password"], button {
                 vertical-align: middle;
@@ -107,6 +109,7 @@
             .cp-sidebarlayout-input-block {
                 display: inline-flex;
                 width: @sidebar_button-width;
+                max-width: 100%;
                 input {
                     flex: 1;
                     //border-radius: 0.25em 0 0 0.25em;
@@ -118,6 +121,7 @@
                     //border: 1px solid #adadad;
                     border-left: 0px;
                     height: @variables_input-height;
+                    margin: 0 !important;
                 }
             }
             &>div {
@@ -162,6 +166,25 @@
             }
 */
         }
+        @media screen and (max-width: @browser_media-medium-screen) {
+            flex-flow: column;
+            overflow: auto;
+            #cp-sidebarlayout-leftside {
+                width: 100% !important; // Override "narrow" mode
+                padding-bottom: 20px;
+                .cp-sidebarlayout-categories {
+                    .cp-sidebarlayout-category {
+                        margin: 0;
+                        span.cp-sidebar-layout-category-name {
+                            display: inline !important; // override "narrow" mode
+                        }
+                    }
+                }
+            }
+            #cp-sidebarlayout-rightside {
+                overflow: unset;
+            }
+        }
     }
 }
 

www/admin/app-admin.less

@@ -27,12 +27,15 @@
     .cp-support-list-actions {
         margin: 10px 0px 10px 2px;
     }
-    .cp-support-list-message {
-        &:last-child:not(.cp-support-fromadmin)  {
-            color: @colortheme_cp-red;
-            background-color: lighten(@colortheme_cp-red, 25%);
-            .cp-support-showdata {
-                background-color: lighten(@colortheme_cp-red, 30%);
+
+    .cp-support-list-ticket:not(.cp-support-list-closed) {
+        .cp-support-list-message {
+            &:last-child:not(.cp-support-fromadmin)  {
+                color: @colortheme_cp-red;
+                background-color: lighten(@colortheme_cp-red, 25%);
+                .cp-support-showdata {
+                    background-color: lighten(@colortheme_cp-red, 30%);
+                }
             }
         }
     }

www/settings/app-settings.less

@@ -17,6 +17,10 @@
     flex-flow: column;
     font: @colortheme_app-font;
 
+    .cp-sidebarlayout-element {
+        max-width: 650px;
+    }
+
     #cp-export-container {
         font-size: 16px;
         display: flex;
@@ -121,8 +125,13 @@
                 border: 1px solid black;
             }
             .cp-settings-language-selector {
+                #cp-language-selector {
+                    display: inline;
+                }
                 button.btn {
                     width: @sidebar_button-width;
+                    max-width: 100%;
+                    margin: 0 !important;
                     background-color: @colortheme_sidebar-button-alt-bg;
                     border-color: #adadad;
                     color: black;
@@ -149,6 +158,7 @@
             .cp-settings-info-block {
                 [type="text"] {
                     width: @sidebar_button-width;
+                    max-width: 100%;
                 }
             }