Merge branch 'staging' into slide2

customize.dist/src/less/loading.less

@@ -3,7 +3,7 @@
 
 #loading {
     position: fixed;
-    z-index: 9999;
+    z-index: 9999999;
     top: 0px;
     bottom: 0px;
     left: 0px;

customize.dist/src/less/toolbar.less

@@ -630,7 +630,7 @@ body .cryptpad-toolbar {
         .title {
             font-size: 25px;
             vertical-align: middle;
-            line-height: 25px;
+            line-height: 48px; //25px;
             white-space: nowrap;
         }
         .pageTitle {

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

@@ -65,6 +65,12 @@
         height: 100%;
         z-index: 99999;
 
+        .message {
+            h1, h2, h3, h4, h5, h6 {
+                color: @alertify-fg;
+            }
+        }
+
         h1, h2, h3 {
             margin-top: 0;
         }
@@ -85,6 +91,20 @@
 
         .dialog {
             padding: 12px;
+/*
+            div.tokenfield {
+                .token {
+                    //border: 1px solid red;
+                    //color: red;
+                }
+
+                color: @colortheme_light-base;
+                background-color: @alertify-dialog-bg;
+
+                input[id$="tokenfield"][type="text"].token-input {
+                    background-color: @alertify-dialog-bg !important;
+                }
+            }*/
         }
 
         .dialog, .alert {
@@ -308,6 +328,5 @@
                 pointer-events: auto;
             }
         }
-
     }
 }

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

@@ -0,0 +1,94 @@
+.tokenfield_main () {
+    .tokenfield {
+        .unselectable () {
+            -webkit-touch-callout: none;
+            -webkit-user-select: none;
+            -khtml-user-select: none;
+            -moz-user-select: none;
+            -ms-user-select: none;
+            user-select: none;
+        }
+
+        .unselectable();
+        height: auto;
+        min-height: 34px;
+        padding-bottom: 0px;
+        &.focus {
+            border-color: #66afe9;
+            outline: 0;
+            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
+        }
+        .token {
+            box-sizing: border-box;
+            border-radius: 3px;
+            display: inline-block;
+            border: 1px solid #d9d9d9;
+            background-color: #ededed;
+            white-space: nowrap;
+            margin: -1px 5px 5px 0;
+            vertical-align: center;
+            cursor: default;
+
+            color: #222;
+
+            &:hover {
+                border-color: #b9b9b9;
+            }
+            &.invalid {
+                background: none;
+                border: 1px solid transparent;
+                border-radius: 0;
+                border-bottom: 1px dotted #d9534f;
+            }
+            &.invalid.active {
+                background: #ededed;
+                border: 1px solid #ededed;
+                border-radius: 3px;
+            }
+            .token-label {
+                display: inline-block;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                padding-left: 4px;
+                vertical-align: center;
+            }
+            .close {
+                font-family: Arial;
+                display: inline-block;
+                line-height: 100%;
+                font-size: 1.1em;
+                margin-left: 5px;
+                float: none;
+                height: 100%;
+                vertical-align: center;
+                padding-right: 4px;
+            }
+            &.active {
+                border-color: #52a8ec;
+                border-color: rgba(82, 168, 236, 0.8);
+            }
+            &.duplicate {
+                border-color: #ebccd1;
+            }
+        }
+        .token-input {
+            background: none;
+            width: 0%; //60px;
+            min-width: 60px;
+            border: 0;
+            padding: 0;
+            margin-bottom: 6px;
+            box-shadow: none;
+            max-width: 100%;
+            &:focus {
+                border-color: transparent;
+                outline: 0;
+                box-shadow: none;
+            }
+        }
+        &.disabled {
+            cursor: not-allowed;
+            background-color: #eeeeee;
+        }
+    }
+}