diff --git a/www/form/app-form.less b/www/form/app-form.less index 8fb892930..69be4a7cc 100644 --- a/www/form/app-form.less +++ b/www/form/app-form.less @@ -152,9 +152,9 @@ } .cp-form-creator-add-full { display: flex; - align-items: center; - margin: 50px 0px 100px 0px; - &> div:first-child { + flex-flow: column; + margin: 20px 0px 100px 0px; + &> div:first-child { // XXX + on the side border-right: 1px solid fade(@cryptpad_text_col, 25%); display: flex; height: 100%; @@ -162,14 +162,17 @@ padding-right: 10px; margin-right: 10px; i { - color: fade(@cryptpad_text_col, 25%); + color: @cryptpad_text_col; font-size: 30px; + width: 50px; + text-align: center; } } .cp-form-creator-control-inline { display: flex; flex-flow: column; justify-content: space-around; + margin-left: 50px; button:not(:last-child) { margin-right: 5px; } diff --git a/www/form/inner.js b/www/form/inner.js index 26d591320..bc3b579bb 100644 --- a/www/form/inner.js +++ b/www/form/inner.js @@ -1945,7 +1945,7 @@ define([ var full = !uid; var idx = content.order.indexOf(uid); var addControl = function (type) { - var btn = h('button.btn.btn-default', { + var btn = h('button.btn.btn-secondary', { title: full ? undefined : Messages['form_type_'+type] }, [ (TYPES[type] || STATIC_TYPES[type]).icon.cloneNode(), @@ -1990,10 +1990,13 @@ define([ $(add).toggleClass('displayed'); }); } + else { + $(add).append(h('span', Messages.tag_add)); + } var inlineCls = full ? '-full' : '-inline'; return h('div.cp-form-creator-add'+inlineCls, [ - h('div', add), + add, buttons ]);