review

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

@@ -159,8 +159,8 @@
                 margin-bottom: @alertify_padding-base;
                 margin: 0;
                 overflow: auto;
-                label{
-                    margin-bottom: 0px;
+                :last-child{
+                    margin-bottom: 0;
                 }
             }
             .alertify-tabs {
@@ -368,7 +368,6 @@
 
             nav {
                 padding: @alertify_padding-base;
-                padding-top: 0px;
                 text-align: right;
                 button {
                     margin: 0px !important;
@@ -521,6 +520,7 @@
             overflow-x: auto;
         }
     }
+    // Bootstrap Alerts 
     .alert {
         margin: 0px 0px @alertify_padding-base 0px;
         font-size: 12px;

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

@@ -6,7 +6,9 @@
     --LessLoader_require: LessLoader_currentFile();
 };
 & {
+    
     .cp-usergrid-container {
+        margin-bottom: 12px; // XXX add margin at bottom of user grids 
         .cp-usergrid-grid {
             display: flex;
             flex-wrap: wrap;
@@ -28,10 +30,9 @@
             input {
                 flex: 1;
                 min-width: 0;
-                margin-top: 0 !important;
+                margin: 0;
                 margin-bottom: 0 !important;
                 height: 38px;
-                margin: 6px 0px;
                 &::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
                     color: @cryptpad_color_grey;
                     opacity: 1; /* Firefox */
@@ -54,6 +55,7 @@
             justify-content: center;
             align-items: center;
             padding: 5px;
+            margin: 3px;
             cursor: default;
             transition: order 0.5s, background-color 0.5s;
             margin-top: 1px;
@@ -72,11 +74,6 @@
             .cp-usergrid-user-avatar {
                 min-height: 40px;
             }
-            &:not(.large) {
-                .cp-usergrid-user-name {
-                    display: none;
-                }
-            }
 
             .cp-usergrid-user-name {
                 overflow: hidden;
@@ -89,7 +86,7 @@
             }
 
             &:not(.large) {
-                .avatar_main(60px);
+                .avatar_main(40px);
             }
             &.large {
                 .avatar_main(25px);

www/common/common-ui-elements.js

@@ -795,8 +795,6 @@ define([
 
         var noOthers = icons.length === 0 ? '.cp-usergrid-empty' : '';
 
-        var buttonSelect = h('button', Messages.share_selectAll);
-        var buttonDeselect = h('button', Messages.share_deselectAll);
         var inputFilter = h('input', {
             placeholder: Messages.share_filterFriend
         });
@@ -817,23 +815,8 @@ define([
                 $div.find('.cp-usergrid-user:not(.cp-selected):not([data-name*="'+name+'"])').hide();
             }
         };
-
         $(inputFilter).on('keydown keyup change', redraw);
 
-        $(buttonSelect).click(function () {
-            $div.find('.cp-usergrid-user:not(.cp-selected):visible').addClass('cp-selected');
-            onSelect();
-        });
-        $(buttonDeselect).click(function () {
-            $div.find('.cp-usergrid-user.cp-selected').removeClass('cp-selected').each(function (i, el) {
-                var order = $(el).attr('data-order');
-                if (!order) { return; }
-                $(el).attr('style', 'order:'+order);
-            });
-            redraw();
-            onSelect();
-        });
-
         $(div).append(h('div.cp-usergrid-grid', icons));
         if (!config.noSelect) {
             $div.on('click', '.cp-usergrid-user', function () {
@@ -1035,7 +1018,7 @@ define([
 
         var makeFaqLink = function () {
             var link = h('span', [
-                h('i.fa.fa-question-circle'), ' ',
+                h('i.fa.fa-question-circle'), ' ', // XXX remove and make it a margin
                 h('a', {href: '#'}, Messages.passwordFaqLink)
             ]);
             $(link).click(function () {
@@ -1098,13 +1081,13 @@ define([
         ] : [
             UI.createCheckbox('cp-share-embed', Messages.share_linkEmbed, false, { mark: {tabindex:1} }),
         ];
-        linkContent.push(h('div.cp-spacer'))
+        linkContent.push(h('div.cp-spacer'));
         linkContent.push(UI.dialog.selectableArea('', { id: 'cp-share-link-preview', tabindex: 1, rows:3}));
 
         // Show alert if the pad is password protected
         if (hasPassword) {
             linkContent.push(h('div.alert.alert-primary', [
-                h('i.fa.fa-lock'), ' ', 
+                h('i.fa.fa-lock'), ' ',  // XXX remove and make it a margin
                 Messages.share_linkPasswordAlert, h('br'),
                 makeFaqLink()
             ]));
@@ -1187,7 +1170,7 @@ define([
         // Show alert if the pad is password protected
         if (hasPassword) {
             $contactsContent.append(h('div.alert.alert-primary', [
-                h('i.fa.fa-unlock'), ' ', 
+                h('i.fa.fa-unlock'), ' ',  // XXX remove and make it a margin
                 Messages.share_contactPasswordAlert, h('br'),
                 makeFaqLink()
             ]));
@@ -1317,6 +1300,7 @@ define([
         return modal;
     };
 
+    // XXX add password messages to file share
     UIElements.createFileShareModal = function (config) {
         var origin = config.origin;
         var pathname = config.pathname;
@@ -1387,10 +1371,8 @@ define([
         // Embed tab
         var embed = h('div.cp-share-modal', [
             h('p', Messages.fileEmbedScript),
-            h('br'),
             UI.dialog.selectable(common.getMediatagScript()),
             h('p', Messages.fileEmbedTag),
-            h('br'),
             UI.dialog.selectable(common.getMediatagFromHref(fileData)),
         ]);
         var embedButtons = [{