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

customize.dist/src/less2/include/alertify.less

@@ -153,12 +153,10 @@
                 max-width: 500px;
                 margin: 0 auto;
                 text-align: left;
-                padding: @alertify_padding-base;
                 background: #fff;
                 box-shadow: @alertify_box-shadow;
                 &.wide {
-                    width: 1000px;
+                    max-width: 850px;
-                    max-width: 70%;
                 }
             }
 
@@ -178,13 +176,14 @@
                 max-height: 100%;
                 display: flex;
                 flex-flow: column;
+                padding: @alertify_padding-base;
                 .alertify-tabs-titles {
                     height: 40px;
                     display: flex;
                     border-bottom: 1px solid @alertify-fore;
                     margin-bottom: 10px;
                     box-sizing: content-box;
-                    span {
+                    .alertify-tabs-title {
                         .tools_unselectable();
                         font-size: 20px;
                         height: 40px;
@@ -201,6 +200,13 @@
                             color: #949494;
                             cursor: not-allowed;
                         }
+                        &:not(.alertify-tabs-active) {
+                            @media (max-width: @browser_media-medium-screen) {
+                                .tab-title-text {
+                                    display: none;
+                                }
+                            }
+                        }
                     }
                     span.alertify-tabs-active {
                         background-color: @alertify-fore !important;
@@ -393,9 +399,15 @@
         .cp-share-columns {
             display: flex;
             flex-flow: row;
+            @media screen and (max-width: (@browser_media-medium-screen)) {
+                flex-flow: column;
+            }
 
             & > .cp-share-column {
                 width: 50%;
+                @media screen and (max-width: (@browser_media-medium-screen)) {
+                    width: unset;
+                }
                 //padding: 0 10px;
                 position: relative;
                 &.contains-nav {
@@ -414,19 +426,32 @@
                 }
                 &:first-child {
                     margin-right: @alertify_padding-base;
+                    @media screen and (max-width: (@browser_media-medium-screen)) {
+                        margin: 0 0 @alertify_padding-base 0;
+                    }
                 }
                 &:last-child {
                     margin-left: @alertify_padding-base;
+                    @media screen and (max-width: (@browser_media-medium-screen)) {
+                        margin: 0px;
+                    }
                 }
             }
             & > .cp-share-column-mid {
                 display: flex;
                 align-items: center;
+                justify-content: center;
+                @media screen and (max-width: (@browser_media-medium-screen)) {
+                    margin-bottom: @alertify_padding-base;
+                }
                 button {
                     width: 50px;
                     margin: 0;
                     min-width: 0;
                     font-size: 18px !important;
+                    @media screen and (max-width: (@browser_media-medium-screen)) {
+                        width: 100%;
+                    }
                 }
             }
         }

customize.dist/src/less2/include/corner.less

@@ -89,6 +89,7 @@
         }
         &.cp-corner-big {
             width: 500px;
+            max-width: 95%;
         }
 
         .cp-corner-dontshow {

customize.dist/src/less2/include/modal.less

@@ -41,6 +41,7 @@
             box-shadow: @variables_shadow;
 
             padding: @variables_padding;
+            padding-top: @variables_padding * 2;
 
             position: relative;
             //top: 15vh; bottom: 15vh;
@@ -57,6 +58,11 @@
                 margin-bottom: 1em;
             }
 
+            & > p:not(.cp-modal-form) {
+                text-align: left; // XXX needs testing
+                margin-right: 30px;
+            }
+
             .cp-modal-form {
                 display: flex;
                 flex-wrap: wrap;

customize.dist/src/less2/include/modals-ui-elements.less

@@ -1,5 +1,7 @@
 @import (reference) "./colortheme-all.less";
 @import (reference) "./variables.less";
+@import (reference) "./browser.less";
+
 .modals-ui-elements_main() {
     --LessLoader_require: LessLoader_currentFile();
 }
@@ -20,6 +22,15 @@
             .cp-radio {
                 margin-right: 30px;
             }
+            @media (max-width: @browser_media-medium-screen) {
+                flex-direction: column;
+                &:not(:last-child) {
+                    margin-bottom: 0px;
+                }
+                .cp-radio {
+                    margin: 0 0 5px 0;
+                }
+            }
         }
     }
 
@@ -74,6 +85,24 @@
     }
 
     // Access modal
+    button.cp-access-add {
+        i {
+            margin-right: 0px !important;
+        }
+        i.fa-arrow-left {
+            display: inline;
+            @media (max-width: @browser_media-medium-screen) {
+                display:none;
+            }
+        }
+        i.fa-arrow-up {
+            display: none;
+            @media (max-width: @browser_media-medium-screen) {
+                display: inline;
+            }
+        }
+    }
+
     .cp-overlay-container {
         position: relative;
         .cp-overlay {

www/common/common-interface.js

@@ -221,9 +221,9 @@ define([
         tabs.forEach(function (tab, i) {
             if (!(tab.content || tab.disabled) || !tab.title) { return; }
             var content = h('div.alertify-tabs-content', tab.content);
-            var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), tab.title);
+            var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), h('span.tab-title-text',{id: 'cp-tab-' + tab.title.toLowerCase(), 'aria-hidden':"true"}, tab.title));
             if (tab.icon) {
-                var icon = h('i', {class: tab.icon});
+                var icon = h('i', {class: tab.icon, 'aria-labelledby': 'cp-tab-' + tab.title.toLowerCase()});
                 $(title).prepend(' ').prepend(icon);
             }
             $(title).click(function () {

www/common/drive-ui.js

@@ -1389,7 +1389,7 @@ define([
                 }
                 $button.show();
                 $button.css({
-                    background: '#000'
+                    background: '#63b1f7'
                 });
                 window.setTimeout(function () {
                     $button.css({
@@ -3693,6 +3693,9 @@ define([
                         APP.hideMenu();
                         return;
                     }
+                    if (!$li.length) {
+                        return void $dirContent.contextmenu();
+                    }
                     // Open the menu
                     $li.contextmenu();
                 });

www/common/inner/access.js

@@ -33,7 +33,7 @@ define([
         opts = opts || {};
         var redrawAll = function () {};
 
-        var addBtn = h('button.btn.btn-primary.fa.fa-arrow-left');
+        var addBtn = h('button.btn.btn-primary.cp-access-add', [h('i.fa.fa-arrow-left'), h('i.fa.fa-arrow-up')]);
 
         var div1 = h('div.cp-share-column.cp-ownership');
         var divMid = h('div.cp-share-column-mid', addBtn);
@@ -388,7 +388,7 @@ define([
 
         var redrawAll = function () {};
 
-        var addBtn = h('button.btn.btn-primary.fa.fa-arrow-left');
+        var addBtn = h('button.btn.btn-primary.cp-access-add', [h('i.fa.fa-arrow-left'), h('i.fa.fa-arrow-up')]);
 
         var div1 = h('div.cp-share-column.cp-allowlist');
         var divMid = h('div.cp-share-column-mid.cp-overlay-container', [

www/common/inner/share.js

@@ -656,7 +656,7 @@ define([
         var tabs = [{
             getTab: getContactsTab,
             title: Messages.share_contactCategory,
-            icon: "fa fa-addessèbook",
+            icon: "fa fa-address-book",
             active: hasFriends,
             onShow: onShowContacts,
             onHide: resetTab
@@ -836,7 +836,7 @@ define([
         var tabs = [{
             getTab: getFileContactsTab,
             title: Messages.share_contactCategory,
-            icon: "fa fa-addessèbook",
+            icon: "fa fa-address-book",
             active: hasFriends,
         }, {
             getTab: getFileLinkTab,

www/profile/inner.js

@@ -6,6 +6,7 @@ define([
     '/bower_components/nthen/index.js',
     '/common/sframe-common.js',
     '/common/common-util.js',
+    '/common/common-hash.js',
     '/common/common-interface.js',
     '/common/common-ui-elements.js',
     '/common/common-realtime.js',
@@ -33,6 +34,7 @@ define([
     nThen,
     SFCommon,
     Util,
+    Hash,
     UI,
     UIElements,
     Realtime,
@@ -481,9 +483,7 @@ define([
         APP.getEdPublic = function () {
             var metadataMgr = APP.common.getMetadataMgr();
             var privateData = metadataMgr.getPrivateData();
-            var name = data.name.toLowerCase().replace(/[^a-zA-Z0-9]+/g, "-");
+            var url = Hash.getPublicSigningKeyString(privateData.origin, data.name, data.edPublic);
-            var ed = data.edPublic.replace(/\//g, '-');
-            var url = privateData.origin + '/user/#/1/' + name + '/' + ed;
             var success = Clipboard.copy(url);
             if (success) { UI.log(Messages.shareSuccess); }
         };