Merge branch 'pcs' into staging
yflory
commit
9f5e5786f3
|
|
@ -1,6 +1,7 @@
|
|||
node_modules/
|
||||
www/bower_components/
|
||||
www/common/pdfjs/
|
||||
www/common/tippy/
|
||||
|
||||
server.js
|
||||
www/common/media-tag.js
|
||||
|
|
@ -8,7 +9,6 @@ www/scratch
|
|||
|
||||
www/common/toolbar.js
|
||||
www/common/hyperscript.js
|
||||
www/common/tippy.min.js
|
||||
|
||||
www/pad/wysiwygarea-plugin.js
|
||||
www/pad/mediatag-plugin.js
|
||||
|
|
|
|||
|
|
@ -633,12 +633,95 @@ define([
|
|||
src: '/customize/cryptpad-new-logo-colors-logoonly.png?' + urlArgs
|
||||
}),
|
||||
h('div.cp-loading-spinner-container',
|
||||
h('span.fa.fa-circle-o-notch.fa-spin.fa-4x.fa-fw')),
|
||||
h('span.fa.fa-circle-o-notch.fa-spin.fa-8x.fa-fw')),
|
||||
h('p'),
|
||||
])
|
||||
);
|
||||
};
|
||||
|
||||
Pages.createCheckbox = function (id, labelTxt, checked, opts) {
|
||||
opts = opts|| {};
|
||||
// Input properties
|
||||
var inputOpts = {
|
||||
type: 'checkbox',
|
||||
id: id
|
||||
};
|
||||
if (checked) { inputOpts.checked = 'checked'; }
|
||||
$.extend(inputOpts, opts.input || {});
|
||||
|
||||
// Label properties
|
||||
var labelOpts = {};
|
||||
$.extend(labelOpts, opts.label || {});
|
||||
if (labelOpts.class) { labelOpts.class += ' cp-checkmark'; }
|
||||
|
||||
// Mark properties
|
||||
var markOpts = { tabindex: 0 };
|
||||
$.extend(markOpts, opts.mark || {});
|
||||
|
||||
var input = h('input', inputOpts);
|
||||
var mark = h('span.cp-checkmark-mark', markOpts);
|
||||
var label = h('span.cp-checkmark-label', labelTxt);
|
||||
|
||||
$(mark).keydown(function (e) {
|
||||
if (e.which === 32) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
$(input).prop('checked', !$(input).is(':checked'));
|
||||
$(input).change();
|
||||
}
|
||||
});
|
||||
|
||||
$(input).change(function () { $(mark).focus(); });
|
||||
|
||||
return h('label.cp-checkmark', labelOpts, [
|
||||
input,
|
||||
mark,
|
||||
label
|
||||
]);
|
||||
};
|
||||
|
||||
Pages.createRadio = function (name, id, labelTxt, checked, opts) {
|
||||
opts = opts|| {};
|
||||
// Input properties
|
||||
var inputOpts = {
|
||||
type: 'radio',
|
||||
id: id,
|
||||
name: name
|
||||
};
|
||||
if (checked) { inputOpts.checked = 'checked'; }
|
||||
$.extend(inputOpts, opts.input || {});
|
||||
|
||||
// Label properties
|
||||
var labelOpts = {};
|
||||
$.extend(labelOpts, opts.label || {});
|
||||
if (labelOpts.class) { labelOpts.class += ' cp-checkmark'; }
|
||||
|
||||
// Mark properties
|
||||
var markOpts = { tabindex: 0 };
|
||||
$.extend(markOpts, opts.mark || {});
|
||||
|
||||
var input = h('input', inputOpts);
|
||||
var mark = h('span.cp-radio-mark', markOpts);
|
||||
var label = h('span.cp-checkmark-label', labelTxt);
|
||||
|
||||
$(mark).keydown(function (e) {
|
||||
if (e.which === 32) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
$(input).prop('checked', !$(input).is(':checked'));
|
||||
$(input).change();
|
||||
}
|
||||
});
|
||||
|
||||
$(input).change(function () { $(mark).focus(); });
|
||||
|
||||
return h('label.cp-radio', labelOpts, [
|
||||
input,
|
||||
mark,
|
||||
label
|
||||
]);
|
||||
};
|
||||
|
||||
var hiddenLoader = function () {
|
||||
var loader = loadingScreen();
|
||||
loader.style.display = 'none';
|
||||
|
|
@ -688,27 +771,10 @@ define([
|
|||
placeholder: Msg.login_confirm,
|
||||
}),
|
||||
h('div.checkbox-container', [
|
||||
h('input#import-recent', {
|
||||
name: 'import-recent',
|
||||
type: 'checkbox',
|
||||
checked: true
|
||||
}),
|
||||
// hscript doesn't generate for on label for some
|
||||
// reason... use jquery as a temporary fallback
|
||||
setHTML($('<label for="import-recent"></label>')[0], Msg.register_importRecent)
|
||||
/*h('label', {
|
||||
'for': 'import-recent',
|
||||
}, Msg.register_importRecent),*/
|
||||
Pages.createCheckbox('import-recent', Msg.register_importRecent, true)
|
||||
]),
|
||||
h('div.checkbox-container', [
|
||||
h('input#accept-terms', {
|
||||
name: 'accept-terms',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
setHTML($('<label for="accept-terms"></label>')[0], Msg.register_acceptTerms)
|
||||
/*setHTML(h('label', {
|
||||
'for': 'accept-terms',
|
||||
}), Msg.register_acceptTerms),*/
|
||||
$(Pages.createCheckbox('accept-terms')).find('.cp-checkmark-label').append(Msg.register_acceptTerms).parent()[0]
|
||||
]),
|
||||
h('button#register.btn.cp-login-register', Msg.login_register)
|
||||
])
|
||||
|
|
@ -750,17 +816,7 @@ define([
|
|||
placeholder: Msg.login_password,
|
||||
}),
|
||||
h('div.checkbox-container', [
|
||||
h('input#import-recent', {
|
||||
name: 'import-recent',
|
||||
type: 'checkbox',
|
||||
checked: true
|
||||
}),
|
||||
// hscript doesn't generate for on label for some
|
||||
// reason... use jquery as a temporary fallback
|
||||
setHTML($('<label for="import-recent"></label>')[0], Msg.register_importRecent)
|
||||
/*h('label', {
|
||||
'for': 'import-recent',
|
||||
}, Msg.register_importRecent),*/
|
||||
Pages.createCheckbox('import-recent', Msg.register_importRecent, true),
|
||||
]),
|
||||
h('div.extra', [
|
||||
h('button.login.first.btn', Msg.login_login)
|
||||
|
|
|
|||
|
|
@ -12,14 +12,11 @@
|
|||
|
||||
@alertify-btn-fg: @alertify-fore;
|
||||
|
||||
@alertify-btn-bg: rgba(200, 200, 200, 0.1);
|
||||
@alertify-btn-bg-hover: rgba(200, 200, 200, .3);
|
||||
|
||||
@alertify-bg: @colortheme_modal-dim;
|
||||
@alertify-fg: @alertify-fore;
|
||||
|
||||
@alertify-input-bg: @colortheme_modal-input;
|
||||
@alertify-input-fg: @colortheme_modal-fg;
|
||||
@alertify-input-fg: @colortheme_modal-input-fg;
|
||||
|
||||
@alertify_padding-base: @variables_padding;
|
||||
@alertify_box-shadow: @variables_shadow;
|
||||
|
|
@ -34,7 +31,7 @@
|
|||
}
|
||||
> * {
|
||||
padding: @alertify_padding-base @alertify_padding-base * 4;
|
||||
color: @alertify-fore;
|
||||
color: @colortheme_notification-color;
|
||||
|
||||
font-family: @colortheme_font;
|
||||
font-size: large;
|
||||
|
|
@ -65,6 +62,8 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 100000; // alertify container
|
||||
font: @colortheme_app-font;
|
||||
|
||||
&.forefront {
|
||||
z-index: @max-z-index; // alertify max forefront
|
||||
}
|
||||
|
|
@ -112,10 +111,6 @@
|
|||
}
|
||||
|
||||
.dialog, .alert {
|
||||
.bright {
|
||||
color: @colortheme_light-base;
|
||||
}
|
||||
|
||||
& > div {
|
||||
background-color: @alertify-dialog-bg;
|
||||
&.half {
|
||||
|
|
@ -227,7 +222,7 @@
|
|||
|
||||
button:not(.btn):not(.pure-button):not(.md-button):not(.mdl-button) {
|
||||
|
||||
background-color: @alertify-btn-bg;
|
||||
background-color: @colortheme_alertify-cancel;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
outline: 0;
|
||||
|
|
@ -247,7 +242,7 @@
|
|||
border-radius: 0;
|
||||
|
||||
color: @alertify-btn-fg;
|
||||
border: 1px solid transparent;
|
||||
border: 1px solid @colortheme_alertify-cancel-border;
|
||||
|
||||
&.safe, &.danger {
|
||||
color: @colortheme_old-base;
|
||||
|
|
@ -256,32 +251,40 @@
|
|||
}
|
||||
&.danger {
|
||||
background-color: @colortheme_alertify-red;
|
||||
border-color: @colortheme_alertify-red-border;
|
||||
color: @colortheme_alertify-red-color;
|
||||
&:hover, &:active {
|
||||
background-color: lighten(@colortheme_alertify-red, 5%);
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-red, 10%), lighten(@colortheme_alertify-red, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&.safe {
|
||||
background-color: @colortheme_alertify-green;
|
||||
border-color: @colortheme_alertify-green-border;
|
||||
color: @colortheme_alertify-green-color;
|
||||
&:hover, &:active {
|
||||
background-color: lighten(@colortheme_alertify-green, 10%);
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-green, 10%), lighten(@colortheme_alertify-green, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&.primary {
|
||||
background-color: @colortheme_alertify-primary;
|
||||
color: @colortheme_alertify-primary-text;
|
||||
border-color: @colortheme_alertify-primary-border;
|
||||
font-weight: bold;
|
||||
&:hover, &:active {
|
||||
background-color: darken(@colortheme_alertify-primary, 10%);
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-primary, 10%), lighten(@colortheme_alertify-primary, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&:hover, &:active {
|
||||
background-color: @alertify-btn-bg-hover;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-cancel, 10%), lighten(@colortheme_alertify-cancel, 10%));
|
||||
}
|
||||
|
||||
&:focus {
|
||||
border: 1px dotted @alertify-base;
|
||||
//border: 1px dotted @alertify-base;
|
||||
box-shadow: 0px 0px 5px @colortheme_alertify-primary;
|
||||
outline: none;
|
||||
}
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
border: 0;
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
|
@ -15,6 +16,7 @@
|
|||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
@width: round(@size / 8);
|
||||
@dim1: round(@size / 3);
|
||||
@dim2: round(2 * @size / 3);
|
||||
@top: round(@size / 12);
|
||||
@top: round(@size / 12) - 1;
|
||||
// <label.cp-checkmark><input><span.cp-checkmark-mark></span>Text</label>
|
||||
.cp-checkmark {
|
||||
margin: 0;
|
||||
|
|
@ -17,6 +17,10 @@
|
|||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
& > a {
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
|
||||
&.cp-checkmark-secondary {
|
||||
.cp-checkmark-mark {
|
||||
&:after {
|
||||
|
|
@ -26,6 +30,7 @@
|
|||
input {
|
||||
&:checked ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-back2;
|
||||
border-color: @colortheme_checkmark-back2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -37,12 +42,19 @@
|
|||
display: none;
|
||||
&:checked ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-back1;
|
||||
border-color: @colortheme_checkmark-back1;
|
||||
&:after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cp-checkmark-label {
|
||||
cursor: default;
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.cp-checkmark-mark {
|
||||
margin-right: 10px;
|
||||
position: relative;
|
||||
|
|
@ -51,6 +63,8 @@
|
|||
background-color: @colortheme_checkmark-back0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 1px solid @colortheme_form-border;
|
||||
flex-shrink: 0;
|
||||
&:after {
|
||||
content: "";
|
||||
display: none;
|
||||
|
|
@ -60,6 +74,90 @@
|
|||
transform: rotate(45deg);
|
||||
border: solid @colortheme_checkmark-col1;
|
||||
border-width: 0 @width @width 0;
|
||||
position: absolute;
|
||||
}
|
||||
&:focus {
|
||||
//border-color: #FF007C !important;
|
||||
box-shadow: 0px 0px 5px @colortheme_checkmark-back1;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.cp-radio {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
&.cp-radio-secondary {
|
||||
.cp-radio-mark {
|
||||
&:after {
|
||||
border-color: @colortheme_checkmark-col2;
|
||||
}
|
||||
}
|
||||
input {
|
||||
&:checked ~ .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back2;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back0-active;
|
||||
}
|
||||
|
||||
input {
|
||||
display: none;
|
||||
&:checked ~ .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back1;
|
||||
border-color: @colortheme_checkmark-back1;
|
||||
&:after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cp-checkmark-label {
|
||||
cursor: default;
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@radio-size: @dim1 * 3;
|
||||
.cp-radio-mark {
|
||||
margin-right: 10px;
|
||||
position: relative;
|
||||
height: @radio-size;
|
||||
width: @radio-size;
|
||||
background-color: @colortheme_checkmark-back0;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid @colortheme_form-border;
|
||||
flex-shrink: 0;
|
||||
&:after {
|
||||
display: none;
|
||||
content: "";
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
width: @dim1;
|
||||
height: @dim1;
|
||||
|
||||
//transform: rotate(45deg);
|
||||
//border: solid @colortheme_checkmark-col1;
|
||||
//border-width: 0 @width @width 0;
|
||||
}
|
||||
&:focus {
|
||||
//border-color: #FF007C !important;
|
||||
box-shadow: 0px 0px 5px @colortheme_checkmark-back1;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,9 @@
|
|||
@colortheme_app-font-size: 16px;
|
||||
@colortheme_app-font: @colortheme_app-font-size @colortheme_font;
|
||||
|
||||
@colortheme_logo-1: #326599;
|
||||
@colortheme_logo-2: #4591c4;
|
||||
|
||||
@colortheme_link-color: #0275D8;
|
||||
@colortheme_link-color-visited: #005999;
|
||||
@colortheme_info-background: #fafafa;
|
||||
|
|
@ -15,23 +18,42 @@
|
|||
@colortheme_cp-red: #FA5858; // remove red
|
||||
@colortheme_cp-green: #46E981;
|
||||
|
||||
@colortheme_modal-bg: #222;
|
||||
@colortheme_modal-fg: #fff;
|
||||
@colortheme_form-border: #bbbbbb;
|
||||
@colortheme_form-bg: @colortheme_logo-2;
|
||||
@colortheme_form-color: #ffffff;
|
||||
@colortheme_form-bg-alt: #ffffff;
|
||||
@colortheme_form-color-alt: @colortheme_logo-1;
|
||||
@colortheme_form-warning: #f49842;
|
||||
@colortheme_form-warning-hov: darken(@colortheme_form-warning, 5%);
|
||||
|
||||
@colortheme_modal-bg: @colortheme_form-bg-alt; // TODO Modals bg
|
||||
@colortheme_modal-fg: @colortheme_form-color-alt;
|
||||
@colortheme_modal-link: #eee;
|
||||
@colortheme_modal-link-visited: lighten(@colortheme_modal-link, 10%);
|
||||
@colortheme_modal-dim: rgba(0, 0, 0, 0.4);
|
||||
@colortheme_modal-dim: fade(@colortheme_logo-2, 50%); // TODO transparent background behind modals
|
||||
@colortheme_modal-input: @colortheme_form-bg;
|
||||
@colortheme_modal-input-fg: @colortheme_form-color;
|
||||
|
||||
@colortheme_loading-bg: #222;
|
||||
@colortheme_loading-bg: @colortheme_logo-1;
|
||||
@colortheme_loading-bg-alt: @colortheme_logo-2;
|
||||
@colortheme_loading-color: @colortheme_old-fore;
|
||||
|
||||
@colortheme_modal-input: #111;
|
||||
|
||||
// TODO modals buttons
|
||||
@colortheme_alertify-red: #E55236;
|
||||
@colortheme_alertify-red-color: #FFF;
|
||||
@colortheme_alertify-red-border: transparent;
|
||||
@colortheme_alertify-green: #77C825;
|
||||
@colortheme_alertify-primary: #fff;
|
||||
@colortheme_alertify-primary-text: #000;
|
||||
@colortheme_alertify-green-color: #FFF;
|
||||
@colortheme_alertify-green-border: transparent;
|
||||
@colortheme_alertify-primary: @colortheme_form-bg;
|
||||
@colortheme_alertify-primary-text: @colortheme_form-color;
|
||||
@colortheme_alertify-primary-border: transparent;
|
||||
@colortheme_alertify-cancel: @colortheme_modal-bg;
|
||||
@colortheme_alertify-cancel-border: #ccc;
|
||||
|
||||
@colortheme_notification-log: rgba(0, 0, 0, 0.8);
|
||||
@colortheme_notification-log: fade(@colortheme_logo-1, 90%);
|
||||
@colortheme_notification-color: #fff;;
|
||||
@colortheme_notification-warn: rgba(205, 37, 50, 0.8);
|
||||
|
||||
@colortheme_dropdown-bg: #f9f9f9;
|
||||
|
|
@ -110,9 +132,9 @@
|
|||
@cryptpad_header_col: #1E1F1F;
|
||||
@cryptpad_text_col: #3F4141;
|
||||
|
||||
@colortheme_checkmark-back0: #ffffff;
|
||||
@colortheme_checkmark-back0-active: #bbbbbb;
|
||||
@colortheme_checkmark-back1: #FF0073;
|
||||
@colortheme_checkmark-col1: #ffffff;
|
||||
@colortheme_checkmark-back2: #FFFFFF;
|
||||
@colortheme_checkmark-col2: #000000;
|
||||
@colortheme_checkmark-back0: @colortheme_form-bg-alt;
|
||||
@colortheme_checkmark-back0-active: @colortheme_form-border;
|
||||
@colortheme_checkmark-back1: @colortheme_form-bg;
|
||||
@colortheme_checkmark-col1: @colortheme_form-color;
|
||||
@colortheme_checkmark-back2: @colortheme_form-bg-alt;
|
||||
@colortheme_checkmark-col2: @colortheme_form-color-alt;
|
||||
|
|
|
|||
|
|
@ -1,47 +1,78 @@
|
|||
@import (once) "./colortheme-all.less";
|
||||
@import (once) "./tools.less";
|
||||
@import (once) "./checkmark.less";
|
||||
@import (once) './icon-colors.less';
|
||||
|
||||
.creation_main() {
|
||||
.tippy-popper {
|
||||
z-index: 100000001 !important;
|
||||
}
|
||||
.creation_main(
|
||||
@color: @colortheme_default-color, // Color of the text for the toolbar
|
||||
@bg-color: @colortheme_default-bg, // color of the toolbar background
|
||||
@warn-color: @colortheme_default-warn, // color of the warning text in the toolbar
|
||||
) {
|
||||
@colortheme_creation-modal-bg: #fff;
|
||||
@colortheme_creation-modal: #666;
|
||||
@colortheme_creation-modal-title: @colortheme_loading-bg;
|
||||
|
||||
#cp-creation-container {
|
||||
position: absolute;
|
||||
z-index: 100000000; // #loading * 10
|
||||
top: 0px;
|
||||
background: @colortheme_loading-bg;
|
||||
//background: @colortheme_loading-bg;
|
||||
background: linear-gradient(to right, @colortheme_loading-bg 0%, @colortheme_loading-bg 50%, @colortheme_loading-bg-alt 50%, @colortheme_loading-bg-alt 100%);
|
||||
color: @colortheme_loading-color;
|
||||
display: flex;
|
||||
flex-flow: column; /* we need column so that the child can shrink vertically */
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
.cp-creation-logo {
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
margin-top: 50px;
|
||||
flex: 0 1 auto; /* allows shrink */
|
||||
min-height: 0;
|
||||
text-align: center;
|
||||
img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
#cp-creation {
|
||||
flex: 0 1 auto; /* allows shrink */
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
background: @colortheme_creation-modal-bg;
|
||||
color: @colortheme_creation-modal;
|
||||
font: @colortheme_app-font;
|
||||
width: 100%;
|
||||
outline: none;
|
||||
width: 700px;
|
||||
max-width: 90vw;
|
||||
height: 500px;
|
||||
max-height: calc(~"100vh - 20px");
|
||||
margin: 50px;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
||||
& > div {
|
||||
width: 60vw;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
margin: 40px auto;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.cp-creation-create, .cp-creation-settings {
|
||||
.cp-creation-title {
|
||||
color: @colortheme_creation-modal-title;
|
||||
font-weight: bold;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.cp-creation-create {
|
||||
margin-top: 0px;
|
||||
@creation-button: #30B239;
|
||||
button {
|
||||
.tools_unselectable();
|
||||
padding: 15px;
|
||||
background: @creation-button;
|
||||
background: linear-gradient(to right, @colortheme_logo-2, @colortheme_logo-1);
|
||||
color: #FFF;
|
||||
font-weight: bold;
|
||||
margin: 3px 10px;
|
||||
|
|
@ -50,8 +81,9 @@
|
|||
outline: none;
|
||||
width: 100%;
|
||||
&:hover {
|
||||
background: linear-gradient(to right, lighten(@colortheme_logo-2, 5%), lighten(@colortheme_logo-1, 5%));
|
||||
//background: darken(@creation-button, 5%);
|
||||
background: lighten(@creation-button, 5%);
|
||||
//background: lighten(@creation-button, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -70,6 +102,7 @@
|
|||
display: flex;
|
||||
flex-flow: column;
|
||||
align-items: center;
|
||||
flex: 1 0 auto;
|
||||
& > div {
|
||||
width: 400px;
|
||||
max-width: 100%;
|
||||
|
|
@ -78,6 +111,8 @@
|
|||
flex-wrap: wrap;
|
||||
font-size: 16px;
|
||||
margin: 10px 0;
|
||||
min-height: 28px;
|
||||
line-height: 28px;
|
||||
label {
|
||||
flex: 1;
|
||||
}
|
||||
|
|
@ -88,31 +123,51 @@
|
|||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
.cp-creation-help {
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
&:hover {
|
||||
color: #AAA;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
.cp-creation-help, .cp-creation-warning {
|
||||
font-size: 18px;
|
||||
color: @colortheme_form-warning;
|
||||
&:hover {
|
||||
color: @colortheme_form-warning-hov;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
.cp-creation-slider {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
max-height: 0px;
|
||||
transition: max-height 0.5s ease-in-out;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
max-width: 0px;
|
||||
//margin-top: 10px;
|
||||
&.active {
|
||||
max-height: 40px;
|
||||
transition: max-height 0.5s ease-in-out;
|
||||
max-width: unset;
|
||||
max-height: 100px;
|
||||
}
|
||||
}
|
||||
.cp-creation-expire {
|
||||
.cp-creation-expire-picker {
|
||||
text-align: center;
|
||||
input, select {
|
||||
font-size: 14px;
|
||||
border: 1px solid @colortheme_form-border;
|
||||
height: 26px;
|
||||
background-color: @colortheme_form-bg;
|
||||
color: @colortheme_form-color;
|
||||
}
|
||||
input {
|
||||
width: 100px;
|
||||
width: 50px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
select {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
label {
|
||||
flex: unset;
|
||||
}
|
||||
.cp-creation-slider {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -125,31 +180,51 @@
|
|||
}
|
||||
|
||||
div.cp-creation-remember {
|
||||
margin-top: 30px;
|
||||
.cp-creation-remember-help {
|
||||
font-style: italic;
|
||||
width: 100%;
|
||||
//font-style: italic;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
color: @colortheme_form-bg;
|
||||
line-height: 20px;
|
||||
.fa {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
div.cp-creation-template {
|
||||
width: 100%;
|
||||
background-color: darken(@colortheme_modal-bg, 3%);
|
||||
padding: 20px;
|
||||
margin: 30px 0;
|
||||
.cp-creation-title {
|
||||
padding: 0 0 10px 10px;
|
||||
margin: auto;
|
||||
flex: 1 0 auto;
|
||||
flex-wrap: nowrap;
|
||||
.cp-creation-template-more {
|
||||
font-size: 30px;
|
||||
cursor: pointer;
|
||||
margin: 0 5px;
|
||||
text-align: center;
|
||||
&:first-child {
|
||||
left: 5px;
|
||||
}
|
||||
&:last-child {
|
||||
right: 5px;
|
||||
}
|
||||
&:hover {
|
||||
color: #888;
|
||||
}
|
||||
&.hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cp-creation-template-container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
overflow-y: auto;
|
||||
//overflow-y: auto;
|
||||
align-items: center;
|
||||
.cp-creation-template-element {
|
||||
@darker: darken(@colortheme_modal-fg, 30%);
|
||||
|
||||
box-shadow: 2px 2px 7px @colortheme_form-border;
|
||||
width: 135px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
|
|
@ -162,19 +237,23 @@
|
|||
line-height: 1em;
|
||||
cursor: pointer;
|
||||
|
||||
background-color: #111;
|
||||
color: @darker;
|
||||
color: black;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&.cp-creation-template-selected {
|
||||
border: 1px solid white;
|
||||
background-color: #222;
|
||||
color: @color !important;
|
||||
background-color: @bg-color !important;
|
||||
.fa {
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
transition: all 0.1s;
|
||||
|
||||
&:hover {
|
||||
color: @colortheme_modal-fg;
|
||||
//color: @colortheme_modal-fg;
|
||||
background-color: @colortheme_form-border;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
align-items: center;
|
||||
|
|
@ -196,6 +275,7 @@
|
|||
max-width: 100%;
|
||||
}
|
||||
.fa {
|
||||
color: @bg-color;
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
|
|
@ -217,45 +297,69 @@
|
|||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkmark_main(30px);
|
||||
|
||||
@media screen and (max-width: @browser_media-narrow-screen) {
|
||||
& > div {
|
||||
width: 95%;
|
||||
margin: 10px auto;
|
||||
@media screen and (max-height: 700px) {
|
||||
#cp-creation-container {
|
||||
.cp-creation-logo {
|
||||
//flex-shrink: 0;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: @browser_media-medium-screen) {
|
||||
#cp-creation-form {
|
||||
div.cp-creation-template {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
.cp-creation-template-container {
|
||||
.cp-creation-template-element {
|
||||
flex-flow: row;
|
||||
margin: 1px;
|
||||
padding: 5px;
|
||||
width: 155px;
|
||||
img {
|
||||
display: none;
|
||||
@media screen and (max-width: 500px) {
|
||||
#cp-creation {
|
||||
#cp-creation-form {
|
||||
& > div {
|
||||
width: 95%;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.cp-creation-expire {
|
||||
&.active {
|
||||
label {
|
||||
flex: 1;
|
||||
}
|
||||
.fa {
|
||||
font-size: 18px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: inline !important;
|
||||
}
|
||||
.cp-creation-template-element-name {
|
||||
margin: 0;
|
||||
margin-left: 5px;
|
||||
.cp-creation-slider {
|
||||
flex: unset;
|
||||
order: 10;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: @browser_media-medium-screen) {
|
||||
#cp-creation {
|
||||
height: auto;
|
||||
#cp-creation-form {
|
||||
div.cp-creation-template {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
.cp-creation-template-container {
|
||||
.cp-creation-template-element {
|
||||
flex-flow: row;
|
||||
margin: 1px;
|
||||
padding: 5px;
|
||||
width: 155px;
|
||||
img {
|
||||
display: none;
|
||||
}
|
||||
.fa {
|
||||
font-size: 18px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: inline !important;
|
||||
}
|
||||
.cp-creation-template-element-name {
|
||||
margin: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,11 @@
|
|||
@import (once) "./colortheme-all.less";
|
||||
@import (once) "./toolbar.less";
|
||||
@import (once) './fileupload.less';
|
||||
@import (once) './alertify.less';
|
||||
@import (once) './tokenfield.less';
|
||||
@import (once) './creation.less';
|
||||
@import (once) './tippy.less';
|
||||
@import (once) "./checkmark.less";
|
||||
|
||||
.framework_main(@bg-color, @warn-color, @color) {
|
||||
.toolbar_main(
|
||||
|
|
@ -13,6 +16,29 @@
|
|||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tokenfield_main();
|
||||
.creation_main();
|
||||
.tippy_main();
|
||||
.checkmark_main(20px);
|
||||
.creation_main(
|
||||
@bg-color: @bg-color,
|
||||
@warn-color: @warn-color,
|
||||
@color: @color
|
||||
);
|
||||
}
|
||||
|
||||
.framework_min_main(
|
||||
@color: @colortheme_default-color, // Color of the text for the toolbar
|
||||
@bg-color: @colortheme_default-bg, // color of the toolbar background
|
||||
@warn-color: @colortheme_default-warn, // color of the warning text in the toolbar
|
||||
) {
|
||||
.toolbar_main(
|
||||
@bg-color: @bg-color,
|
||||
@warn-color: @warn-color,
|
||||
@color: @color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tippy_main();
|
||||
.checkmark_main(20px);
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@
|
|||
text-overflow: ellipsis;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
border: 1px solid white;
|
||||
|
||||
.cp-icons-name {
|
||||
width: 100%;
|
||||
|
|
@ -26,7 +25,7 @@
|
|||
word-wrap: break-word;
|
||||
}
|
||||
&.cp-icons-element-selected {
|
||||
background-color: white;
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
color: #666;
|
||||
}
|
||||
.fa {
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
|
||||
input {
|
||||
background-color: @colortheme_modal-input;
|
||||
color: @colortheme_modal-fg;
|
||||
color: @colortheme_modal-input-fg;
|
||||
border: 0;
|
||||
padding: 8px 12px;
|
||||
margin: 1em;
|
||||
|
|
|
|||
|
|
@ -52,6 +52,12 @@
|
|||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
label.noTitle {
|
||||
display: inline-flex;
|
||||
.fa {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
[type="text"], button {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,14 @@
|
|||
@import (once) './colortheme-all.less';
|
||||
|
||||
.tippy_main() {
|
||||
.tippy-tooltip.cryptpad-theme {
|
||||
/* Your styling here. Example: */
|
||||
background-color: white;
|
||||
box-shadow: 2px 2px 10px #000;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
[x-circle] {
|
||||
background-color: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -183,8 +183,13 @@
|
|||
#cp-app-toolbar-creation-dialog.cp-modal-container {
|
||||
.icons_main();
|
||||
|
||||
li:hover {
|
||||
border: 1px solid white;
|
||||
li {
|
||||
border: 1px solid @colortheme_modal-fg;
|
||||
&:hover {
|
||||
//border: 1px solid @colortheme_modal-fg;
|
||||
background: @colortheme_modal-fg;
|
||||
color: @colortheme_modal-bg;
|
||||
}
|
||||
}
|
||||
.cp-modal {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme-all.less";
|
||||
@import (once) "../include/alertify.less";
|
||||
@import (once) "../include/checkmark.less";
|
||||
@import (once) "../loading.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
.alertify_main();
|
||||
.checkmark_main(20px);
|
||||
|
||||
.form-group {
|
||||
.extra {
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme-all.less";
|
||||
@import (once) "../include/alertify.less";
|
||||
@import (once) "../include/checkmark.less";
|
||||
@import (once) "../loading.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
.alertify_main();
|
||||
.checkmark_main(20px);
|
||||
|
||||
.cp-container {
|
||||
.form-group {
|
||||
|
|
|
|||
|
|
@ -6,13 +6,13 @@ define([
|
|||
'/common/common-notifier.js',
|
||||
'/customize/application_config.js',
|
||||
'/bower_components/alertifyjs/dist/js/alertify.js',
|
||||
'/common/tippy.min.js',
|
||||
'/common/tippy/tippy.min.js',
|
||||
'/customize/pages.js',
|
||||
'/common/hyperscript.js',
|
||||
'/common/test.js',
|
||||
|
||||
'/bower_components/bootstrap-tokenfield/dist/bootstrap-tokenfield.js',
|
||||
'css!/common/tippy.css',
|
||||
'css!/common/tippy/tippy.css',
|
||||
], function ($, Messages, Util, Hash, Notifier, AppConfig,
|
||||
Alertify, Tippy, Pages, h, Test) {
|
||||
var UI = {};
|
||||
|
|
@ -539,16 +539,16 @@ define([
|
|||
|
||||
var LOADING = 'cp-loading';
|
||||
|
||||
var getRandomTip = function () {
|
||||
/*var getRandomTip = function () {
|
||||
if (!Messages.tips || !Object.keys(Messages.tips).length) { return ''; }
|
||||
var keys = Object.keys(Messages.tips);
|
||||
var rdm = Math.floor(Math.random() * keys.length);
|
||||
return Messages.tips[keys[rdm]];
|
||||
};
|
||||
};*/
|
||||
UI.addLoadingScreen = function (config) {
|
||||
config = config || {};
|
||||
var loadingText = config.loadingText;
|
||||
var hideTips = config.hideTips || AppConfig.hideLoadingScreenTips;
|
||||
//var hideTips = config.hideTips || AppConfig.hideLoadingScreenTips;
|
||||
var hideLogo = config.hideLogo;
|
||||
var $loading, $container;
|
||||
if ($('#' + LOADING).length) {
|
||||
|
|
@ -557,9 +557,9 @@ define([
|
|||
$loading.removeClass('cp-loading-hidden');
|
||||
$('.cp-loading-spinner-container').show();
|
||||
if (loadingText) {
|
||||
$('#' + LOADING).find('p').text(loadingText);
|
||||
$('#' + LOADING).find('p').show().text(loadingText);
|
||||
} else {
|
||||
$('#' + LOADING).find('p').text('');
|
||||
$('#' + LOADING).find('p').hide().text('');
|
||||
}
|
||||
$container = $loading.find('.cp-loading-container');
|
||||
} else {
|
||||
|
|
@ -574,14 +574,14 @@ define([
|
|||
$spinner.show();
|
||||
$('body').append($loading);
|
||||
}
|
||||
if (Messages.tips && !hideTips) {
|
||||
/*if (Messages.tips && !hideTips) {
|
||||
var $loadingTip = $('<div>', {'id': 'cp-loading-tip'});
|
||||
$('<span>', {'class': 'tips'}).text(getRandomTip()).appendTo($loadingTip);
|
||||
$loadingTip.css({
|
||||
'bottom': $('body').height()/2 - $container.height()/2 + 20 + 'px'
|
||||
});
|
||||
$('body').append($loadingTip);
|
||||
}
|
||||
}*/
|
||||
};
|
||||
UI.removeLoadingScreen = function (cb) {
|
||||
// Release the test blocker, hopefully every test has been registered.
|
||||
|
|
@ -610,8 +610,8 @@ define([
|
|||
}
|
||||
$('.cp-loading-spinner-container').hide();
|
||||
$('#cp-loading-tip').remove();
|
||||
if (transparent) { $('#' + LOADING).css('opacity', 0.8); }
|
||||
$('#' + LOADING).find('p').html(error || Messages.error);
|
||||
if (transparent) { $('#' + LOADING).css('opacity', 0.9); }
|
||||
$('#' + LOADING).find('p').show().html(error || Messages.error);
|
||||
if (exitable) {
|
||||
$(window).focus();
|
||||
$(window).keydown(function (e) {
|
||||
|
|
@ -660,18 +660,38 @@ define([
|
|||
});
|
||||
};
|
||||
|
||||
var delay = typeof(AppConfig.tooltipDelay) === "number" ? AppConfig.tooltipDelay : 500;
|
||||
$.extend(true, Tippy.defaults, {
|
||||
placement: 'bottom',
|
||||
performance: true,
|
||||
delay: [delay, 0],
|
||||
//sticky: true,
|
||||
theme: 'cryptpad',
|
||||
arrow: true,
|
||||
maxWidth: '200px',
|
||||
flip: true,
|
||||
popperOptions: {
|
||||
modifiers: {
|
||||
preventOverflow: { boundariesElement: 'window' }
|
||||
}
|
||||
},
|
||||
//arrowType: 'round',
|
||||
arrowTransform: 'scale(2)',
|
||||
zIndex: 100000001
|
||||
});
|
||||
UI.addTooltips = function () {
|
||||
var MutationObserver = window.MutationObserver;
|
||||
var delay = typeof(AppConfig.tooltipDelay) === "number" ? AppConfig.tooltipDelay : 500;
|
||||
var addTippy = function (i, el) {
|
||||
if (el.nodeName === 'IFRAME') { return; }
|
||||
Tippy(el, {
|
||||
position: 'bottom',
|
||||
distance: 0,
|
||||
performance: true,
|
||||
delay: [delay, 0],
|
||||
sticky: true
|
||||
var opts = {
|
||||
distance: 15
|
||||
};
|
||||
Array.prototype.slice.apply(el.attributes).filter(function (obj) {
|
||||
return /^data-tippy-/.test(obj.name);
|
||||
}).forEach(function (obj) {
|
||||
opts[obj.name.slice(11)] = obj.value;
|
||||
});
|
||||
Tippy(el, opts);
|
||||
};
|
||||
// This is the robust solution to remove dangling tooltips
|
||||
// The mutation observer does not always find removed nodes.
|
||||
|
|
@ -720,5 +740,9 @@ define([
|
|||
});
|
||||
};
|
||||
|
||||
UI.createCheckbox = Pages.createCheckbox;
|
||||
|
||||
UI.createRadio = Pages.createRadio;
|
||||
|
||||
return UI;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -13,8 +13,6 @@ define([
|
|||
'/customize/messages.js',
|
||||
'/customize/application_config.js',
|
||||
'/bower_components/nthen/index.js',
|
||||
|
||||
'css!/common/tippy.css',
|
||||
], function ($, Config, Util, Hash, Language, UI, Constants, Feedback, h, MediaTag, Clipboard,
|
||||
Messages, AppConfig, NThen) {
|
||||
var UIElements = {};
|
||||
|
|
@ -237,7 +235,11 @@ define([
|
|||
var link = h('div.cp-share-modal', [
|
||||
h('label', Messages.share_linkAccess),
|
||||
h('br'),
|
||||
h('input#cp-share-editable-true.cp-share-editable-value', {
|
||||
UI.createRadio('cp-share-editable', 'cp-share-editable-true',
|
||||
Messages.share_linkEdit, true, { mark: {tabindex:1} }),
|
||||
UI.createRadio('cp-share-editable', 'cp-share-editable-false',
|
||||
Messages.share_linkView, false, { mark: {tabindex:1} }),
|
||||
/*h('input#cp-share-editable-true.cp-share-editable-value', {
|
||||
type: 'radio',
|
||||
name: 'cp-share-editable',
|
||||
value: 1,
|
||||
|
|
@ -248,25 +250,14 @@ define([
|
|||
name: 'cp-share-editable',
|
||||
value: 0
|
||||
}),
|
||||
h('label', { 'for': 'cp-share-editable-false' }, Messages.share_linkView),
|
||||
h('br'),
|
||||
h('label', { 'for': 'cp-share-editable-false' }, Messages.share_linkView),*/
|
||||
h('br'),
|
||||
h('label', Messages.share_linkOptions),
|
||||
h('br'),
|
||||
h('input#cp-share-embed', {
|
||||
type: 'checkbox',
|
||||
name: 'cp-share-embed'
|
||||
}),
|
||||
h('label', { 'for': 'cp-share-embed' }, Messages.share_linkEmbed),
|
||||
UI.createCheckbox('cp-share-embed', Messages.share_linkEmbed, false, { mark: {tabindex:1} }),
|
||||
UI.createCheckbox('cp-share-present', Messages.share_linkPresent, false, { mark: {tabindex:1} }),
|
||||
h('br'),
|
||||
h('input#cp-share-present', {
|
||||
type: 'checkbox',
|
||||
name: 'cp-share-present'
|
||||
}),
|
||||
h('label', { 'for': 'cp-share-present' }, Messages.share_linkPresent),
|
||||
h('br'),
|
||||
h('br'),
|
||||
UI.dialog.selectable('', { id: 'cp-share-link-preview' })
|
||||
UI.dialog.selectable('', { id: 'cp-share-link-preview', tabindex: 1 })
|
||||
]);
|
||||
if (!hashes.editHash) {
|
||||
$(link).find('#cp-share-editable-false').attr('checked', true);
|
||||
|
|
@ -1685,14 +1676,10 @@ define([
|
|||
var priv = common.getMetadataMgr().getPrivateData();
|
||||
var c = (priv.settings.general && priv.settings.general.creation) || {};
|
||||
if (AppConfig.displayCreationScreen && common.isLoggedIn() && c.skip) {
|
||||
$advanced = $('<input>', {
|
||||
type: 'checkbox',
|
||||
checked: 'checked',
|
||||
id: 'cp-app-toolbar-creation-advanced'
|
||||
}).appendTo($advancedContainer);
|
||||
$('<label>', {
|
||||
for: 'cp-app-toolbar-creation-advanced'
|
||||
}).text(Messages.creation_newPadModalAdvanced).appendTo($advancedContainer);
|
||||
var $cboxLabel = $(UI.createCheckbox('cp-app-toolbar-creation-advanced',
|
||||
Messages.creation_newPadModalAdvanced, true))
|
||||
.appendTo($advancedContainer);
|
||||
$advanced = $cboxLabel.find('input');
|
||||
$description.append('<br>');
|
||||
$description.append(Messages.creation_newPadModalDescriptionAdvanced);
|
||||
}
|
||||
|
|
@ -1782,11 +1769,15 @@ define([
|
|||
var sframeChan = common.getSframeChannel();
|
||||
var focus;
|
||||
|
||||
var pickerCfg = {
|
||||
var pickerCfgInit = {
|
||||
types: [type],
|
||||
where: ['template'],
|
||||
hidden: true
|
||||
};
|
||||
var pickerCfg = {
|
||||
types: [type],
|
||||
where: ['template'],
|
||||
};
|
||||
var onConfirm = function (yes) {
|
||||
if (!yes) {
|
||||
if (focus) { focus.focus(); }
|
||||
|
|
@ -1814,7 +1805,7 @@ define([
|
|||
|
||||
sframeChan.query("Q_TEMPLATE_EXIST", type, function (err, data) {
|
||||
if (data) {
|
||||
common.openFilePicker(pickerCfg);
|
||||
common.openFilePicker(pickerCfgInit);
|
||||
focus = document.activeElement;
|
||||
if (force) { return void onConfirm(true); }
|
||||
UI.confirm(Messages.useTemplate, onConfirm, {
|
||||
|
|
@ -1858,11 +1849,15 @@ define([
|
|||
|
||||
var $body = $('body');
|
||||
var $creationContainer = $('<div>', { id: 'cp-creation-container' }).appendTo($body);
|
||||
var urlArgs = (Config.requireConf && Config.requireConf.urlArgs) || '';
|
||||
var l = h('div.cp-creation-logo', h('img', { src: '/customize/alt-favicon.png?' + urlArgs }));
|
||||
$(l).appendTo($creationContainer);
|
||||
var $creation = $('<div>', { id: 'cp-creation', tabindex: 1 }).appendTo($creationContainer);
|
||||
|
||||
// Title
|
||||
var colorClass = 'cp-icon-color-'+type;
|
||||
$creation.append(h('h2.cp-creation-title', Messages.newButtonTitle));
|
||||
//var colorClass = 'cp-icon-color-'+type;
|
||||
//$creation.append(h('h2.cp-creation-title', Messages.newButtonTitle));
|
||||
$creation.append(h('h3.cp-creation-title', Messages['button_new'+type]));
|
||||
//$creation.append(h('h2.cp-creation-title.'+colorClass, Messages.newButtonTitle));
|
||||
|
||||
// Deleted pad warning
|
||||
|
|
@ -1874,10 +1869,11 @@ define([
|
|||
|
||||
var origin = common.getMetadataMgr().getPrivateData().origin;
|
||||
var createHelper = function (href, text) {
|
||||
var q = h('a.cp-creation-help.fa.fa-question', {
|
||||
var q = h('a.cp-creation-help.fa.fa-question-circle', {
|
||||
title: text,
|
||||
href: origin + href,
|
||||
target: "_blank"
|
||||
target: "_blank",
|
||||
'data-tippy-placement': "right"
|
||||
});
|
||||
return q;
|
||||
};
|
||||
|
|
@ -1885,30 +1881,14 @@ define([
|
|||
// Owned pads
|
||||
// Default is Owned pad
|
||||
var owned = h('div.cp-creation-owned', [
|
||||
h('label.cp-checkmark', [
|
||||
h('input', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-creation-owned',
|
||||
checked: 'checked'
|
||||
}),
|
||||
h('span.cp-checkmark-mark'),
|
||||
Messages.creation_owned
|
||||
]),
|
||||
UI.createCheckbox('cp-creation-owned', Messages.creation_owned, true),
|
||||
createHelper('/faq.html#keywords-owned', Messages.creation_owned1)
|
||||
]);
|
||||
|
||||
// Life time
|
||||
var expire = h('div.cp-creation-expire', [
|
||||
h('label.cp-checkmark', [
|
||||
h('input', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-creation-expire'
|
||||
}),
|
||||
h('span.cp-checkmark-mark'),
|
||||
Messages.creation_expire
|
||||
]),
|
||||
createHelper('/faq.html#keywords-expiring', Messages.creation_expire2),
|
||||
h('div.cp-creation-expire-picker.cp-creation-slider', [
|
||||
UI.createCheckbox('cp-creation-expire', Messages.creation_expire, false),
|
||||
h('span.cp-creation-expire-picker.cp-creation-slider', [
|
||||
h('input#cp-creation-expire-val', {
|
||||
type: "number",
|
||||
min: 1,
|
||||
|
|
@ -1923,106 +1903,142 @@ define([
|
|||
selected: 'selected'
|
||||
}, Messages.creation_expireMonths)
|
||||
])
|
||||
]),
|
||||
createHelper('/faq.html#keywords-expiring', Messages.creation_expire2),
|
||||
]);
|
||||
|
||||
var right = h('span.fa.fa-chevron-right.cp-creation-template-more');
|
||||
var left = h('span.fa.fa-chevron-left.cp-creation-template-more');
|
||||
var templates = h('div.cp-creation-template', [
|
||||
left,
|
||||
h('div.cp-creation-template-container', [
|
||||
h('span.fa.fa-circle-o-notch.fa-spin.fa-4x.fa-fw')
|
||||
]),
|
||||
right
|
||||
]);
|
||||
|
||||
var settings = h('div.cp-creation-remember', [
|
||||
UI.createCheckbox('cp-creation-remember', Messages.creation_saveSettings, false),
|
||||
createHelper('/settings/#creation', Messages.creation_settings),
|
||||
h('div.cp-creation-remember-help.cp-creation-slider', [
|
||||
h('span.fa.fa-exclamation-circle.cp-creation-warning'),
|
||||
Messages.creation_rememberHelp
|
||||
])
|
||||
]);
|
||||
|
||||
var createDiv = h('div.cp-creation-create');
|
||||
var $create = $(createDiv);
|
||||
|
||||
var templates = h('div.cp-creation-template', [
|
||||
h('h3.cp-creation-title.'+colorClass, Messages['button_new'+type]),
|
||||
h('div.cp-creation-template-container', [
|
||||
h('span.fa.fa-circle-o-notch.fa-spin.fa-4x.fa-fw')
|
||||
]),
|
||||
createDiv
|
||||
]);
|
||||
|
||||
var settings = h('div.cp-creation-remember', [
|
||||
h('label.cp-checkmark', [
|
||||
h('input', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-creation-remember'
|
||||
}),
|
||||
h('span.cp-checkmark-mark'),
|
||||
Messages.creation_saveSettings
|
||||
]),
|
||||
createHelper('/settings/#creation', Messages.creation_settings),
|
||||
h('div.cp-creation-remember-help.cp-creation-slider', Messages.creation_rememberHelp)
|
||||
]);
|
||||
|
||||
$(h('div#cp-creation-form', [
|
||||
owned,
|
||||
expire,
|
||||
settings,
|
||||
templates
|
||||
templates,
|
||||
createDiv
|
||||
])).appendTo($creation);
|
||||
|
||||
// Display templates
|
||||
var selected = 0;
|
||||
|
||||
var selected = 0; // Selected template in the list (highlighted)
|
||||
var TEMPLATES_DISPLAYED = 4; // Max templates displayed per page
|
||||
var next = function () {}; // Function called when pressing tab to highlight the next template
|
||||
var i = 0; // Index of the first template displayed in the current page
|
||||
sframeChan.query("Q_CREATE_TEMPLATES", type, function (err, res) {
|
||||
if (!res.data || !Array.isArray(res.data)) {
|
||||
return void console.error("Error: get the templates list");
|
||||
}
|
||||
var data = res.data.slice().sort(function (a, b) {
|
||||
if (a.name === b.name) { return 0; }
|
||||
return a.name < b.name ? -1 : 1;
|
||||
var allData = res.data.slice().sort(function (a, b) {
|
||||
if (a.used === b.used) {
|
||||
// Sort by name
|
||||
if (a.name === b.name) { return 0; }
|
||||
return a.name < b.name ? -1 : 1;
|
||||
}
|
||||
return b.used - a.used;
|
||||
});
|
||||
data.unshift({
|
||||
name: Messages.creation_noTemplate,
|
||||
id: 0,
|
||||
icon: h('span.fa.fa-file')
|
||||
});
|
||||
data.push({
|
||||
allData.unshift({
|
||||
name: Messages.creation_newTemplate,
|
||||
id: -1,
|
||||
icon: h('span.fa.fa-bookmark')
|
||||
});
|
||||
var $container = $(templates).find('.cp-creation-template-container').html('');
|
||||
data.forEach(function (obj, idx) {
|
||||
var name = obj.name;
|
||||
var $span = $('<span>', {
|
||||
'class': 'cp-creation-template-element',
|
||||
'title': name,
|
||||
}).appendTo($container);
|
||||
$span.data('id', obj.id);
|
||||
if (idx === 0) { $span.addClass('cp-creation-template-selected'); }
|
||||
$span.append(obj.icon || UI.getFileIcon({type: type}));
|
||||
$('<span>', {'class': 'cp-creation-template-element-name'}).text(name)
|
||||
.appendTo($span);
|
||||
$span.click(function () {
|
||||
$container.find('.cp-creation-template-selected')
|
||||
.removeClass('cp-creation-template-selected');
|
||||
$span.addClass('cp-creation-template-selected');
|
||||
selected = idx;
|
||||
});
|
||||
|
||||
// Add thumbnail if it exists
|
||||
if (obj.thumbnail) {
|
||||
common.addThumbnail(obj.thumbnail, $span, function () {});
|
||||
}
|
||||
allData.unshift({
|
||||
name: Messages.creation_noTemplate,
|
||||
id: 0,
|
||||
icon: h('span.fa.fa-file')
|
||||
});
|
||||
});
|
||||
// Change template selection when Tab is pressed
|
||||
var next = function (revert) {
|
||||
var max = $creation.find('.cp-creation-template-element').length;
|
||||
selected = revert ?
|
||||
(--selected < 0 ? max-1 : selected) :
|
||||
++selected % max;
|
||||
$creation.find('.cp-creation-template-element')
|
||||
.removeClass('cp-creation-template-selected');
|
||||
$($creation.find('.cp-creation-template-element').get(selected))
|
||||
.addClass('cp-creation-template-selected');
|
||||
};
|
||||
var redraw = function (index) {
|
||||
if (index < 0) { i = 0; }
|
||||
else if (index > allData.length - 1) { return; }
|
||||
else { i = index; }
|
||||
var data = allData.slice(i, i + TEMPLATES_DISPLAYED);
|
||||
var $container = $(templates).find('.cp-creation-template-container').html('');
|
||||
data.forEach(function (obj, idx) {
|
||||
var name = obj.name;
|
||||
var $span = $('<span>', {
|
||||
'class': 'cp-creation-template-element',
|
||||
'title': name,
|
||||
}).appendTo($container);
|
||||
$span.data('id', obj.id);
|
||||
if (idx === selected) { $span.addClass('cp-creation-template-selected'); }
|
||||
$span.append(obj.icon || UI.getFileIcon({type: type}));
|
||||
$('<span>', {'class': 'cp-creation-template-element-name'}).text(name)
|
||||
.appendTo($span);
|
||||
$span.click(function () {
|
||||
$container.find('.cp-creation-template-selected')
|
||||
.removeClass('cp-creation-template-selected');
|
||||
$span.addClass('cp-creation-template-selected');
|
||||
selected = idx;
|
||||
});
|
||||
|
||||
// Add thumbnail if it exists
|
||||
if (obj.thumbnail) {
|
||||
common.addThumbnail(obj.thumbnail, $span, function () {});
|
||||
}
|
||||
});
|
||||
$(right).off('click').removeClass('hidden').click(function () {
|
||||
selected = 0;
|
||||
redraw(i + TEMPLATES_DISPLAYED);
|
||||
});
|
||||
if (i >= allData.length - TEMPLATES_DISPLAYED ) { $(right).addClass('hidden'); }
|
||||
$(left).off('click').removeClass('hidden').click(function () {
|
||||
selected = TEMPLATES_DISPLAYED - 1;
|
||||
redraw(i - TEMPLATES_DISPLAYED);
|
||||
});
|
||||
if (i < TEMPLATES_DISPLAYED) { $(left).addClass('hidden'); }
|
||||
};
|
||||
redraw(0);
|
||||
|
||||
// Change template selection when Tab is pressed
|
||||
next = function (revert) {
|
||||
var max = $creation.find('.cp-creation-template-element').length;
|
||||
if (selected + 1 === max && !revert) {
|
||||
selected = i + TEMPLATES_DISPLAYED < allData.length ? 0 : max;
|
||||
return void redraw(i + TEMPLATES_DISPLAYED);
|
||||
}
|
||||
if (selected === 0 && revert) {
|
||||
selected = i - TEMPLATES_DISPLAYED >= 0 ? TEMPLATES_DISPLAYED - 1 : 0;
|
||||
return void redraw(i - TEMPLATES_DISPLAYED);
|
||||
}
|
||||
selected = revert ?
|
||||
(--selected < 0 ? 0 : selected) :
|
||||
++selected >= max ? max-1 : selected;
|
||||
$creation.find('.cp-creation-template-element')
|
||||
.removeClass('cp-creation-template-selected');
|
||||
$($creation.find('.cp-creation-template-element').get(selected))
|
||||
.addClass('cp-creation-template-selected');
|
||||
};
|
||||
|
||||
});
|
||||
|
||||
// Display expiration form when checkbox checked
|
||||
$creation.find('#cp-creation-expire').on('change', function () {
|
||||
if ($(this).is(':checked')) {
|
||||
$creation.find('.cp-creation-expire-picker:not(.active)').addClass('active');
|
||||
$creation.find('.cp-creation-expire:not(.active)').addClass('active');
|
||||
$creation.find('#cp-creation-expire-val').focus();
|
||||
return;
|
||||
}
|
||||
$creation.find('.cp-creation-expire-picker').removeClass('active');
|
||||
$creation.find('.cp-creation-expire').removeClass('active');
|
||||
$creation.focus();
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -424,6 +424,7 @@ define([
|
|||
// it allows us to add owners and expiration time if it is a new file
|
||||
var parsed = Hash.parsePadUrl(href);
|
||||
if(!parsed) { throw new Error("Cannot get template hash"); }
|
||||
postMessage("INCREMENT_TEMPLATE_USE", href);
|
||||
Crypt.get(parsed.hash, function (err, val) {
|
||||
if (err) { throw new Error(err); }
|
||||
var p = Hash.parsePadUrl(window.location.href);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
// dark #326599
|
||||
// light #4591c4
|
||||
define([], function () {
|
||||
var loadingStyle = (function(){/*
|
||||
#cp-loading {
|
||||
|
|
@ -9,31 +11,74 @@ define([], function () {
|
|||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
background: #222;
|
||||
background: linear-gradient(to right, #326599 0%, #326599 50%, #4591c4 50%, #4591c4 100%);
|
||||
color: #fafafa;
|
||||
text-align: center;
|
||||
font-size: 1.5em;
|
||||
opacity: 1;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
#cp-loading.cp-loading-hidden {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
#cp-loading .cp-loading-logo {
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
margin-top: 50px;
|
||||
flex: 0 1 auto;
|
||||
min-height: 0;
|
||||
text-align: center;
|
||||
}
|
||||
#cp-loading .cp-loading-logo img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
#cp-loading .cp-loading-container {
|
||||
margin-top: 50vh;
|
||||
transform: translateY(-50%);
|
||||
width: 700px;
|
||||
max-width: 90vw;
|
||||
height: 500px;
|
||||
max-height: calc(100vh - 20px);
|
||||
margin: 50px;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@media screen and (max-height: 800px) {
|
||||
#cp-loading .cp-loading-container {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 600px) {
|
||||
#cp-loading .cp-loading-container {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
#cp-loading .cp-loading-cryptofist {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
height: 300px;
|
||||
//height: 300px;
|
||||
max-width: 90vw;
|
||||
max-height: 300px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
@media screen and (max-height: 450px) {
|
||||
#cp-loading .cp-loading-cryptofist {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
#cp-loading-message {
|
||||
background: #FFF;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
color: #000;
|
||||
display: none;
|
||||
}
|
||||
#cp-loading .cp-loading-spinner-container {
|
||||
position: relative;
|
||||
height: 100px;
|
||||
|
|
@ -75,8 +120,10 @@ define([], function () {
|
|||
'<style>',
|
||||
loadingStyle,
|
||||
'</style>',
|
||||
'<div class="cp-loading-logo">',
|
||||
'<img class="cp-loading-cryptofist" src="/customize/alt-favicon.png?' + urlArgs + '">',
|
||||
'</div>',
|
||||
'<div class="cp-loading-container">',
|
||||
'<img class="cp-loading-cryptofist" src="/customize/cryptpad-new-logo-colors-logoonly.png?' + urlArgs + '">',
|
||||
'<div class="cp-loading-spinner-container">',
|
||||
'<span class="fa fa-circle-o-notch fa-spin fa-4x fa-fw"></span>',
|
||||
'</div>',
|
||||
|
|
|
|||
|
|
@ -660,6 +660,15 @@ define([
|
|||
});
|
||||
cb(res);
|
||||
};
|
||||
Store.incrementTemplateUse = function (href) {
|
||||
store.userObject.getPadAttribute(href, 'used', function (err, data) {
|
||||
// This is a not critical function, abort in case of error to make sure we won't
|
||||
// create any issue with the user object or the async store
|
||||
if (err) { return; }
|
||||
var used = typeof data === "number" ? ++data : 1;
|
||||
store.userObject.setPadAttribute(href, 'used', used);
|
||||
});
|
||||
};
|
||||
|
||||
// Pads
|
||||
Store.moveToTrash = function (data, cb) {
|
||||
|
|
|
|||
|
|
@ -126,6 +126,9 @@ define([
|
|||
case 'GET_STRONGER_HASH': {
|
||||
Store.getStrongerHash(data, cb); break;
|
||||
}
|
||||
case 'INCREMENT_TEMPLATE_USE': {
|
||||
Store.incrementTemplateUse(data); break;
|
||||
}
|
||||
// Messaging
|
||||
case 'INVITE_FROM_USERLIST': {
|
||||
Store.inviteFromUserlist(data, cb); break;
|
||||
|
|
|
|||
|
|
@ -431,6 +431,8 @@ define([
|
|||
// File picker
|
||||
var FP = {};
|
||||
var initFilePicker = function (cfg) {
|
||||
// cfg.hidden means pre-loading the filepicker while keeping it hidden.
|
||||
// if cfg.hidden is true and the iframe already exists, do nothing
|
||||
if (!FP.$iframe) {
|
||||
var config = {};
|
||||
config.onFilePicked = function (data) {
|
||||
|
|
@ -449,7 +451,7 @@ define([
|
|||
};
|
||||
FP.$iframe = $('<iframe>', {id: 'sbox-filePicker-iframe'}).appendTo($('body'));
|
||||
FP.picker = FilePicker.create(config);
|
||||
} else {
|
||||
} else if (!cfg.hidden) {
|
||||
FP.$iframe.show();
|
||||
FP.picker.refresh(cfg);
|
||||
}
|
||||
|
|
@ -491,7 +493,8 @@ define([
|
|||
res.push({
|
||||
id: el,
|
||||
name: data[el].filename || data[el].title || '?',
|
||||
thumbnail: thumb
|
||||
thumbnail: thumb,
|
||||
used: data[el].used || 0
|
||||
});
|
||||
}));
|
||||
});
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,17 +1,13 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_friends-bg,
|
||||
@warn-color: @colortheme_friends-warn,
|
||||
@color: @colortheme_friends-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
|
||||
// body
|
||||
&.cp-app-contacts {
|
||||
|
|
|
|||
|
|
@ -1,15 +1,11 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/tools.less';
|
||||
@import (once) '../../customize/src/less2/include/tokenfield.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main();
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tokenfield_main();
|
||||
.framework_min_main();
|
||||
|
||||
// body
|
||||
&.cp-app-debug {
|
||||
|
|
|
|||
|
|
@ -1,20 +1,17 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/leftside-menu.less';
|
||||
@import (once) "../../customize/src/less2/include/tools.less";
|
||||
@import (once) "../../customize/src/less2/include/limit-bar.less";
|
||||
@import (once) "../../customize/src/less2/include/tokenfield.less";
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_drive-bg,
|
||||
@warn-color: @colortheme_drive-warn,
|
||||
@color: @colortheme_drive-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
|
||||
.limit-bar_main();
|
||||
.tokenfield_main();
|
||||
|
||||
|
|
|
|||
|
|
@ -1,26 +1,17 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/tokenfield.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_file-bg,
|
||||
@warn-color: @colortheme_file-warn,
|
||||
@color: @colortheme_file-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tokenfield_main();
|
||||
|
||||
@button-border: 2px;
|
||||
|
||||
/*html, body {
|
||||
margin: 0px;
|
||||
height: 100%;
|
||||
}*/
|
||||
|
||||
// body
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
|
|
|||
|
|
@ -3,10 +3,12 @@
|
|||
@import (once) '../../customize/src/less2/include/icon-colors.less';
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/tippy.less';
|
||||
|
||||
.iconColors_main();
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tippy_main();
|
||||
|
||||
#cp-filepicker-dialog {
|
||||
display: none;
|
||||
|
|
@ -36,7 +38,8 @@
|
|||
line-height: 1em;
|
||||
cursor: pointer;
|
||||
|
||||
background-color: #111;
|
||||
background-color: @colortheme_modal-bg;
|
||||
box-shadow: 2px 2px 5px #000;
|
||||
color: @darker;
|
||||
|
||||
transition: all 0.1s;
|
||||
|
|
|
|||
|
|
@ -1,22 +1,15 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/tokenfield.less';
|
||||
@import (once) '../../customize/src/less2/include/tools.less';
|
||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
||||
@import (once) '../../customize/src/less2/include/creation.less';
|
||||
@import (once) "../../customize/src/less2/include/framework.less";
|
||||
|
||||
.toolbar_main(
|
||||
|
||||
.framework_main(
|
||||
@bg-color: @colortheme_poll-bg,
|
||||
@warn-color: @colortheme_poll-warn,
|
||||
@color: @colortheme_poll-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tokenfield_main();
|
||||
.creation_main();
|
||||
|
||||
@poll-fore: #555;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,19 +1,15 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
||||
@import (once) '../../customize/src/less2/include/sidebar-layout.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_profile-bg,
|
||||
@warn-color: @colortheme_profile-warn,
|
||||
@color: @colortheme_profile-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.sidebar-layout_main();
|
||||
|
||||
// body
|
||||
|
|
|
|||
|
|
@ -118,15 +118,10 @@ define([
|
|||
}, 500);
|
||||
|
||||
$register.on('keypress', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
console.error(e.which);
|
||||
switch (e.which) {
|
||||
case 13: return clickRegister();
|
||||
case 13: return clickRegister();
|
||||
default:
|
||||
//console.log(e.which);
|
||||
if (e.which === 13) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
return clickRegister();
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,18 +1,15 @@
|
|||
@import (once) "../../customize/src/less2/include/colortheme-all.less";
|
||||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/sidebar-layout.less';
|
||||
@import (once) "../../customize/src/less2/include/limit-bar.less";
|
||||
@import (once) "../../customize/src/less2/include/creation.less";
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_settings-bg,
|
||||
@warn-color: @colortheme_settings-warn,
|
||||
@color: @colortheme_settings-color
|
||||
);
|
||||
.alertify_main();
|
||||
.sidebar-layout_main();
|
||||
.limit-bar_main();
|
||||
.creation_main();
|
||||
|
|
@ -21,6 +18,7 @@
|
|||
&.cp-app-settings {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
font: @colortheme_app-font;
|
||||
#cp-sidebarlayout-container {
|
||||
#cp-sidebarlayout-rightside {
|
||||
input[type="checkbox"] {
|
||||
|
|
|
|||
|
|
@ -233,16 +233,14 @@ define([
|
|||
// Disable
|
||||
$('<span>', {'class': 'cp-sidebarlayout-description'})
|
||||
.text(Messages.settings_disableThumbnailsDescription).appendTo($div);
|
||||
var $label = $('<label>', { 'for': 'disableThumbnails', 'class': 'noTitle' })
|
||||
.text(Messages.settings_disableThumbnailsAction);
|
||||
|
||||
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
|
||||
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
|
||||
|
||||
var $checkbox = $('<input>', {
|
||||
'type': 'checkbox',
|
||||
id: 'disableThumbnails'
|
||||
}).on('change', function () {
|
||||
var $cbox = $(UI.createCheckbox('disableThumbnails',
|
||||
Messages.settings_disableThumbnailsAction,
|
||||
false, { label: {class: 'noTitle'} }));
|
||||
var $checkbox = $cbox.find('input').on('change', function () {
|
||||
$spinner.show();
|
||||
$ok.hide();
|
||||
var val = $checkbox.is(':checked') || false;
|
||||
|
|
@ -252,11 +250,10 @@ define([
|
|||
});
|
||||
});
|
||||
|
||||
$checkbox.appendTo($div);
|
||||
$label.appendTo($div);
|
||||
$cbox.appendTo($div);
|
||||
|
||||
$ok.hide().appendTo($div);
|
||||
$spinner.hide().appendTo($div);
|
||||
$ok.hide().appendTo($cbox);
|
||||
$spinner.hide().appendTo($cbox);
|
||||
|
||||
common.getAttribute(['general', 'disableThumbnails'], function (e, val) {
|
||||
$checkbox[0].checked = typeof(val) === "undefined" || val;
|
||||
|
|
@ -283,9 +280,6 @@ define([
|
|||
|
||||
$('<span>', {'class': 'label'}).text(Messages.settings_userFeedbackTitle).appendTo($div);
|
||||
|
||||
var $label = $('<label>', { 'for': 'cp-settings-userfeedback', 'class': 'noTitle' })
|
||||
.text(Messages.settings_userFeedback);
|
||||
|
||||
$('<span>', {'class': 'cp-sidebarlayout-description'})
|
||||
.append(Messages.settings_userFeedbackHint1)
|
||||
.append(Messages.settings_userFeedbackHint2).appendTo($div);
|
||||
|
|
@ -293,10 +287,10 @@ define([
|
|||
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
|
||||
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
|
||||
|
||||
var $checkbox = $('<input>', {
|
||||
'type': 'checkbox',
|
||||
id: 'cp-settings-userfeedback'
|
||||
}).on('change', function () {
|
||||
var $cbox = $(UI.createCheckbox('cp-settings-userfeedback',
|
||||
Messages.settings_userFeedback,
|
||||
false, { label: {class: 'noTitle'} }));
|
||||
var $checkbox = $cbox.find('input').on('change', function () {
|
||||
$spinner.show();
|
||||
$ok.hide();
|
||||
var val = $checkbox.is(':checked') || false;
|
||||
|
|
@ -306,11 +300,10 @@ define([
|
|||
});
|
||||
});
|
||||
|
||||
$checkbox.appendTo($div);
|
||||
$label.appendTo($div);
|
||||
$cbox.appendTo($div);
|
||||
|
||||
$ok.hide().appendTo($div);
|
||||
$spinner.hide().appendTo($div);
|
||||
$ok.hide().appendTo($cbox);
|
||||
$spinner.hide().appendTo($cbox);
|
||||
|
||||
if (privateData.feedbackAllowed) {
|
||||
$checkbox[0].checked = true;
|
||||
|
|
@ -730,30 +723,28 @@ define([
|
|||
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
|
||||
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
|
||||
|
||||
var $label = $('<label>', { 'for': 'cp-settings-padwidth', 'class': 'noTitle' })
|
||||
.text(Messages.settings_padWidthLabel);
|
||||
var $input = $('<input>', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-settings-padwidth'
|
||||
}).on('change', function () {
|
||||
var $cbox = $(UI.createCheckbox('cp-settings-padwidth',
|
||||
Messages.settings_padWidthLabel,
|
||||
false, { label: {class: 'noTitle'} }));
|
||||
var $checkbox = $cbox.find('input').on('change', function () {
|
||||
$spinner.show();
|
||||
$ok.hide();
|
||||
var val = $input.is(':checked');
|
||||
var val = $checkbox.is(':checked');
|
||||
common.setAttribute(['pad', 'width'], val, function () {
|
||||
$spinner.hide();
|
||||
$ok.show();
|
||||
});
|
||||
}).appendTo($div);
|
||||
$label.appendTo($div);
|
||||
});
|
||||
$cbox.appendTo($div);
|
||||
|
||||
$ok.hide().appendTo($div);
|
||||
$spinner.hide().appendTo($div);
|
||||
$ok.hide().appendTo($cbox);
|
||||
$spinner.hide().appendTo($cbox);
|
||||
|
||||
|
||||
common.getAttribute(['pad', 'width'], function (e, val) {
|
||||
if (e) { return void console.error(e); }
|
||||
if (val) {
|
||||
$input.attr('checked', 'checked');
|
||||
$checkbox.attr('checked', 'checked');
|
||||
}
|
||||
});
|
||||
return $div;
|
||||
|
|
@ -805,13 +796,14 @@ define([
|
|||
}).css('flex-flow', 'column')
|
||||
.appendTo($div);
|
||||
|
||||
var $input = $('<input>', {
|
||||
type: 'checkbox',
|
||||
}).on('change', function () {
|
||||
var val = $input.is(':checked');
|
||||
|
||||
var $cbox = $(UI.createCheckbox('cp-settings-codeindent'));
|
||||
var $checkbox = $cbox.find('input').on('change', function () {
|
||||
var val = $checkbox.is(':checked');
|
||||
if (typeof(val) !== 'boolean') { return; }
|
||||
common.setAttribute(['codemirror', key], val);
|
||||
}).appendTo($inputBlock);
|
||||
});
|
||||
$cbox.appendTo($inputBlock);
|
||||
|
||||
/*proxy.on('change', ['settings', 'codemirror', key], function (o, n) {
|
||||
$input[0].checked = !!n;
|
||||
|
|
@ -819,7 +811,7 @@ define([
|
|||
|
||||
common.getAttribute(['codemirror', key], function (e, val) {
|
||||
if (e) { return void console.error(e); }
|
||||
$input[0].checked = !!val;
|
||||
$checkbox[0].checked = !!val;
|
||||
});
|
||||
return $div;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -153,53 +153,33 @@ define([
|
|||
$('<b>').text(Messages.printOptions).appendTo($p);
|
||||
$p.append($('<br>'));
|
||||
// Slide number
|
||||
$('<input>', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-app-slide-options-number',
|
||||
checked: slideOptionsTmp.slide
|
||||
}).on('change', function () {
|
||||
var cbox = UI.createCheckbox('cp-app-slide-options-number', Messages.printSlideNumber,
|
||||
slideOptionsTmp.slide);
|
||||
$(cbox).appendTo($p).find('input').on('change', function () {
|
||||
var c = this.checked;
|
||||
slideOptionsTmp.slide = c;
|
||||
}).appendTo($p).css('width', 'auto');
|
||||
$('<label>', {'for': 'cp-app-slide-options-number'}).text(Messages.printSlideNumber)
|
||||
.appendTo($p);
|
||||
$p.append($('<br>'));
|
||||
}).css('width', 'auto');
|
||||
// Date
|
||||
$('<input>', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-app-slide-options-date',
|
||||
checked: slideOptionsTmp.date
|
||||
}).on('change', function () {
|
||||
var cboxDate = UI.createCheckbox('cp-app-slide-options-date', Messages.printDate,
|
||||
slideOptionsTmp.date);
|
||||
$(cboxDate).appendTo($p).find('input').on('change', function () {
|
||||
var c = this.checked;
|
||||
slideOptionsTmp.date = c;
|
||||
}).appendTo($p).css('width', 'auto');
|
||||
$('<label>', {'for': 'cp-app-slide-options-date'}).text(Messages.printDate)
|
||||
.appendTo($p);
|
||||
$p.append($('<br>'));
|
||||
}).css('width', 'auto');
|
||||
// Title
|
||||
$('<input>', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-app-slide-options-title',
|
||||
checked: slideOptionsTmp.title
|
||||
}).on('change', function () {
|
||||
var cboxTitle = UI.createCheckbox('cp-app-slide-options-title', Messages.printTitle,
|
||||
slideOptionsTmp.title);
|
||||
$(cboxTitle).appendTo($p).find('input').on('change', function () {
|
||||
var c = this.checked;
|
||||
slideOptionsTmp.title = c;
|
||||
}).appendTo($p).css('width', 'auto');
|
||||
$('<label>', {'for': 'cp-app-slide-options-title'}).text(Messages.printTitle)
|
||||
.appendTo($p);
|
||||
$p.append($('<br>'));
|
||||
}).css('width', 'auto');
|
||||
// Transition
|
||||
$('<input>', {
|
||||
type: 'checkbox',
|
||||
id: 'cp-app-slide-options-transition',
|
||||
checked: slideOptionsTmp.transition
|
||||
}).on('change', function () {
|
||||
var cboxTransition = UI.createCheckbox('cp-app-slide-options-transition', Messages.printTransition,
|
||||
slideOptionsTmp.transition);
|
||||
$(cboxTransition).appendTo($p).find('input').on('change', function () {
|
||||
var c = this.checked;
|
||||
slideOptionsTmp.transition = c;
|
||||
}).appendTo($p).css('width', 'auto');
|
||||
$('<label>', {'for': 'cp-app-slide-options-transition'}).text(Messages.printTransition)
|
||||
.appendTo($p);
|
||||
$p.append($('<br>'));
|
||||
}).css('width', 'auto');
|
||||
$p.append($('<br>'));
|
||||
// Background image
|
||||
$('<label>', {'for': 'cp-app-slide-options-bg'}).text(Messages.printBackground)
|
||||
|
|
|
|||
|
|
@ -1,17 +1,13 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
.toolbar_main(
|
||||
.framework_min_main(
|
||||
@bg-color: @colortheme_todo-bg,
|
||||
@warn-color: @colortheme_todo-warn,
|
||||
@color: @colortheme_todo-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
|
||||
// body
|
||||
&.cp-app-todo {
|
||||
|
|
|
|||
|
|
@ -1,21 +1,13 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/tools.less';
|
||||
@import (once) '../../customize/src/less2/include/tokenfield.less';
|
||||
@import (once) '../../customize/src/less2/include/creation.less';
|
||||
@import (once) "../../customize/src/less2/include/framework.less";
|
||||
|
||||
.toolbar_main(
|
||||
.framework_main(
|
||||
@bg-color: @colortheme_whiteboard-bg,
|
||||
@warn-color: @colortheme_whiteboard-warn,
|
||||
@color: @colortheme_whiteboard-color
|
||||
);
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.tokenfield_main();
|
||||
.creation_main();
|
||||
|
||||
// body
|
||||
&.cp-app-whiteboard {
|
||||
|
|
|
|||
|
|
@ -1,14 +1,9 @@
|
|||
@import (once) "../../customize/src/less2/include/browser.less";
|
||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
||||
@import (once) '../../customize/src/less2/include/framework.less';
|
||||
|
||||
|
||||
.toolbar_main();
|
||||
.fileupload_main();
|
||||
.alertify_main();
|
||||
.framework_min_main();
|
||||
|
||||
// body
|
||||
&.cp-app-worker {
|
||||
|
|
|
|||
Loading…
Reference in New Issue