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

customize.dist/fonts/cptools/style.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: 'cptools';
   src:
-    url('fonts/cptools.ttf?n9y2kz') format('truetype'),
-    url('fonts/cptools.woff?n9y2kz') format('woff'),
-    url('fonts/cptools.svg?n9y2kz#cptools') format('svg');
+    url('fonts/cptools.ttf?am461j') format('truetype'),
+    url('fonts/cptools.woff?am461j') format('woff'),
+    url('fonts/cptools.svg?am461j#cptools') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -25,11 +25,35 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.cptools-sheet:before {
-  content: "\e908";
+.cptools-form-list-check:before {
+  content: "\e916";
 }
-.cptools-slide:before {
-  content: "\e907";
+.cptools-form-grid-check:before {
+  content: "\e917";
+}
+.cptools-form-poll:before {
+  content: "\e910";
+}
+.cptools-form-grid-radio:before {
+  content: "\e918";
+}
+.cptools-form-list-radio:before {
+  content: "\e919";
+}
+.cptools-form-page-break:before {
+  content: "\e91a";
+}
+.cptools-form-paragraph:before {
+  content: "\e91b";
+}
+.cptools-form-text:before {
+  content: "\e91c";
+}
+.cptools-form-list-ordered:before {
+  content: "\e91d";
+}
+.cptools-folder-no-color:before {
+  content: "\e900";
 }
 .cptools-whiteboard:before {
   content: "\e901";
@@ -37,6 +61,9 @@
 .cptools-new-template:before {
   content: "\e902";
 }
+.cptools-shared-folder:before {
+  content: "\e903";
+}
 .cptools-file-upload:before {
   content: "\e904";
 }
@@ -46,9 +73,24 @@
 .cptools-poll:before {
   content: "\e906";
 }
+.cptools-slide:before {
+  content: "\e907";
+}
+.cptools-sheet:before {
+  content: "\e908";
+}
+.cptools-folder-open:before {
+  content: "\e909";
+}
 .cptools-kanban:before {
   content: "\e90a";
 }
+.cptools-folder:before {
+  content: "\e90b";
+}
+.cptools-shared-folder-open:before {
+  content: "\e90c";
+}
 .cptools-code:before {
   content: "\e90d";
 }
@@ -58,8 +100,11 @@
 .cptools-file:before {
   content: "\e90f";
 }
-.cptools-destroy:before {
-  content: "\e915";
+.cptools-palette:before {
+  content: "\e911";
+}
+.cptools-folder-upload:before {
+  content: "\e912";
 }
 .cptools-add-bottom:before {
   content: "\e913";
@@ -67,24 +112,6 @@
 .cptools-add-top:before {
   content: "\e914";
 }
-.cptools-folder-upload:before {
-  content: "\e912";
-}
-.cptools-folder-no-color:before {
-  content: "\e900";
-}
-.cptools-shared-folder:before {
-  content: "\e903";
-}
-.cptools-folder-open:before {
-  content: "\e909";
-}
-.cptools-folder:before {
-  content: "\e90b";
-}
-.cptools-shared-folder-open:before {
-  content: "\e90c";
-}
-.cptools-palette:before {
-  content: "\e911";
+.cptools-destroy:before {
+  content: "\e915";
 }

www/form/app-form.less

@@ -13,6 +13,7 @@
     flex-flow: column;
     font: @colortheme_app-font;
     color: @cryptpad_text_col;
+    background-color: @cp_app-bg;
 
     #cp-app-form-editor {
         flex: 1;
@@ -84,7 +85,7 @@
 
                 .cp-form-creator-add-inline {
                     display: flex;
-                    flex-flow: column;
+                    flex-flow: row;
                     align-items: center;
                     margin-bottom: 20px;
                     button {
@@ -94,6 +95,8 @@
                         }
                     }
                     .cp-form-creator-inline-add {
+                        font-size: 25px;
+                        margin-right: 30px;
                         .add-close { display: none; }
                         &.displayed {
                             .add-close { display: inline; }
@@ -103,26 +106,39 @@
                     .cp-form-creator-control-inline {
                         display: flex;
                         justify-content: space-around;
-                        margin-top: 10px;
                         button:not(:last-child) {
                             margin-right: 5px;
                         }
-                        .cp-form-creator-types:first-child {
-                            margin-right: 50px;
+                        .cp-form-creator-types {
+                            button {
+                                border: 0px;
+                                //padding-bottom: 3px;
+                                i {
+                                    font-size: 35px;
+                                    line-height: 35px;
+                                }
+                            }
+                            &:first-child {
+                                margin-right: 50px;
+                            }
                         }
                     }
                 }
                 .cp-form-creator-add-full {
                     display: flex;
                     align-items: center;
-                    margin-bottom: 20px;
+                    margin: 50px 0px 100px 0px;
                     &> div:first-child {
-                        border-right: 1px solid black;
+                        border-right: 1px solid fade(@cryptpad_text_col, 25%);
                         display: flex;
                         height: 100%;
                         align-items: center;
                         padding-right: 10px;
                         margin-right: 10px;
+                        i {
+                            color: fade(@cryptpad_text_col, 25%);
+                            font-size: 30px;
+                        }
                     }
                     .cp-form-creator-control-inline {
                         display: flex;
@@ -131,8 +147,20 @@
                         button:not(:last-child) {
                             margin-right: 5px;
                         }
-                        .cp-form-creator-types:first-child {
-                            margin-right: 50px;
+                        .cp-form-creator-types {
+                            button {
+                                border: 0px;
+                                padding:5px;
+                                margin-right: 10px;
+                                i {
+                                    font-size: 35px;
+                                    line-height: 35px;
+                                }
+                            }
+                            &:first-child {
+                                margin-bottom: 20px;
+                                margin-right: 50px;
+                            }
                         }
                     }
                 }

www/form/inner.js

@@ -851,12 +851,12 @@ define([
                 };
             },
             printResults: function () { return; },
-            icon: h('i.fa.fa-info')
+            icon: h('i.cptools.cptools-form-paragraph')
         },
         page: {
             get: function () {
                 var tag = h('div.cp-form-page-break-edit', [
-                    h('i.fa.fa-hand-o-right'),
+                    h('i.cptools.cptools-form-page-break'),
                     h('span', Messages.form_type_page)
                 ]);
                 return {
@@ -865,7 +865,7 @@ define([
                 };
             },
             printResults: function () { return; },
-            icon: h('i.fa.fa-hand-o-right')
+            icon: h('i.cptools.cptools-form-page-break')
         },
     };
     var TYPES = {
@@ -913,7 +913,7 @@ define([
 
                 return h('div.cp-form-results-type-text', results);
             },
-            icon: h('i.fa.fa-font')
+            icon: h('i.cptools.cptools-form-text')
         },
         textarea: {
             defaultOpts: {
@@ -1030,7 +1030,7 @@ define([
 
                 return h('div.cp-form-results-type-radio', results);
             },
-            icon: h('i.fa.fa-list-ul')
+            icon: h('i.cptools.cptools-form-list-radio')
         },
         multiradio: {
             defaultOpts: {
@@ -1142,7 +1142,7 @@ define([
 
                 return h('div.cp-form-results-type-radio', results);
             },
-            icon: h('i.fa.fa-list-ul')
+            icon: h('i.cptools.cptools-form-grid-radio')
         },
         checkbox: {
             defaultOpts: {
@@ -1231,7 +1231,7 @@ define([
 
                 return h('div.cp-form-results-type-radio', results);
             },
-            icon: h('i.fa.fa-check-square-o')
+            icon: h('i.cptools.cptools-form-list-check')
         },
         multicheck: {
             defaultOpts: {
@@ -1355,7 +1355,7 @@ define([
 
                 return h('div.cp-form-results-type-radio', results);
             },
-            icon: h('i.fa.fa-list-ul')
+            icon: h('i.cptools.cptools-form-grid-check')
         },
         poll: {
             defaultOpts: {
@@ -1443,7 +1443,7 @@ define([
                 var lines = makePollTable(_answers, form[uid].opts);
                 return h('div.cp-form-type-poll', lines);
             },
-            icon: h('i.cptools.cptools-poll')
+            icon: h('i.cptools.cptools-form-poll')
         },
         sort: {
             defaultOpts: {
@@ -1818,7 +1818,7 @@ define([
             var full = !uid;
             var idx = content.order.indexOf(uid);
             var addControl = function (type) {
-                var btn = h('button.btn.small', {
+                var btn = h('button.btn.btn-default', {
                     title: full ? undefined : Messages['form_type_'+type]
                 }, [
                     (TYPES[type] || STATIC_TYPES[type]).icon.cloneNode(),
@@ -1849,7 +1849,7 @@ define([
                 h('div.cp-form-creator-types', controls),
                 h('div.cp-form-creator-types', staticControls)
             ]);
-            var add = h('div', Messages.tag_add);
+            var add = h('div', [h('i.fa.fa-plus')]);
             if (!full) {
                 add = h('button.btn.cp-form-creator-inline-add', {
                     title: Messages.tag_add