infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

Migrate all remaining apps to support dark theme

Browse Source
pull/1/head
yflory 4 years ago
parent e41e6c39ce
commit 623aba2705
20 changed files with 239 additions and 224 deletions
Show Stats Download Patch File Download Diff File

53
customize.dist/src/less2/include/colortheme-dark.less
Unescape Escape View File

@ -129,16 +129,18 @@
@cryptpad_color_lighter_grey: #FFF-#f9f9f9; @cryptpad_color_lighter_grey: #FFF-#f9f9f9;
@cryptpad_color_light_blue: #FFF-#00b7d8; @cryptpad_color_light_blue: #FFF-#00b7d8;
@cryptpad_color_lighter_blue: #FFF-#d2e1f2;
@cryptpad_color_warn_red: #FFF-#eb675e; @cryptpad_color_warn_red: #FFF-#eb675e;
@cryptpad_color_dark_red: #9e0000; @cryptpad_color_dark_red: #9e0000;
@cryptpad_color_light_red: #FFD4D4;
@cryptpad_color_orange: #f49842; @cryptpad_color_orange: #f49842;
@cryptpad_color_black: #FFF-#000; @cryptpad_color_black: #FFF-#000;
@cryptpad_color_white: #FFF-#FFF; @cryptpad_color_white: #FFF-#FFF;
@cryptpad_color_light_green: #c5ffa8;
@cryptpad_color_green: #5cb85c; @cryptpad_color_green: #5cb85c;
@cryptpad_color_light_red: darken(#FFD4D4, 75%);
@cryptpad_color_light_green: darken(#c5ffa8, 75%);
@cryptpad_color_light_yellow: darken(#FFE69C, 75%);
@cryptpad_color_lighter_blue: darken(#d2e1f2, 75%);
@cryptpad_color_link: #FFF-#0275D8; @cryptpad_color_link: #FFF-#0275D8;
// Premium plans colors // Premium plans colors
@ -199,7 +201,7 @@
@cp_buttons-cancel-border: #949494; @cp_buttons-cancel-border: #949494;
// Sidebar layout // Sidebar layout
@cp_sidebar-left-bg: @cryptpad_color_grey; @cp_sidebar-left-bg: @cryptpad_color_toolbar_grey;
@cp_sidebar-left-fg: @cryptpad_color_black; @cp_sidebar-left-fg: @cryptpad_color_black;
@cp_sidebar-left-active: @cryptpad_color_white; @cp_sidebar-left-active: @cryptpad_color_white;
@cp_sidebar-right-bg: @cryptpad_color_white; @cp_sidebar-right-bg: @cryptpad_color_white;
@ -212,6 +214,7 @@
@cp_drive-header-fg: @cryptpad_color_dark_grey; @cp_drive-header-fg: @cryptpad_color_dark_grey;
@cp_drive-icon-hover: @cryptpad_color_grey; @cp_drive-icon-hover: @cryptpad_color_grey;
@cp_drive-icon-border: @cryptpad_color_neutral2_grey; @cp_drive-icon-border: @cryptpad_color_neutral2_grey;
@cp_drive-thumb-bg: @cryptpad_color_hint_grey;
@cp_drive-selected-bg: @cryptpad_color_dark_grey; @cp_drive-selected-bg: @cryptpad_color_dark_grey;
@cp_drive-selected-fg: contrast(@cp_drive-droppable-bg, @cryptpad_text_col, @cryptpad_color_light_grey); @cp_drive-selected-fg: contrast(@cp_drive-droppable-bg, @cryptpad_text_col, @cryptpad_color_light_grey);
@cp_drive-selection-overlay: fade(@cryptpad_color_black, 70%); @cp_drive-selection-overlay: fade(@cryptpad_color_black, 70%);
@ -344,6 +347,7 @@
// Apps // Apps
@cp_app-bg: @cryptpad_color_light_grey; @cp_app-bg: @cryptpad_color_light_grey;
@cp_app-fg: @cryptpad_text_col;
// Accounts // Accounts
@cp_accounts-basic: @cryptpad_color_basic; @cp_accounts-basic: @cryptpad_color_basic;
@ -402,4 +406,43 @@
@cp_notif-bg: @cryptpad_color_lighter_grey; @cp_notif-bg: @cryptpad_color_lighter_grey;
@cp_notif-fg: @cryptpad_text_col; @cp_notif-fg: @cryptpad_text_col;
// OO
@cp_oo-offline-overlay: fade(@cryptpad_color_white, 50%);
// Rich text
@cp_pad-fg: @cryptpad_text_col;
@cp_pad-icon-filter: invert();
// Poll
@cp_poll-th-bg: @cryptpad_color_lighter_blue;
@cp_poll-th-fg: @cryptpad_text_col;
@cp_poll-uncommitted-bg: @cryptpad_color_toolbar_grey;
@cp_poll-border-color: @cryptpad_color_hint_grey;
@cp_poll-cell-fg: @cryptpad_text_col;
@cp_poll-unset: @cryptpad_color_help_grey;
@cp_poll-yes: @cryptpad_color_light_green;
@cp_poll-no: @cryptpad_color_light_red;
@cp_poll-maybe: @cryptpad_color_light_yellow;
@cp_poll-hint: @cryptpad_color_dark_grey;
// Profile
@cp_profile-border: @cryptpad_color_help_grey;
@cp_profile-hint: @cryptpad_color_hint_grey;
// SLide
@cp_slide-fg: @cp_app-fg;
@cp_slide-css-error: @cryptpad_color_toolbar_grey;
// Teams
@cp_teams-card-bg: @cryptpad_color_grey;
@cp_teams-leftside-bg: @cryptpad_color_grey;
@cp_teams-invite-bg: fade(@colortheme_logo-2, 50%);
@cp_teams-invite-fg: @cryptpad_text_col;
@cp_teams-roster-odd: fade(@cryptpad_text_col, 15%);
// Whiteboard
@cp_whiteboard-board-bg: @cp_app-bg;
@cp_whiteboard-board-border: @cryptpad_color_hint_grey;
@cp_whiteboard-bg: @cp_app-bg;
@cp_whiteboard-fg: @cryptpad_text_col;

45
customize.dist/src/less2/include/colortheme.less
Unescape Escape View File

@ -142,6 +142,7 @@
@cryptpad_color_white: #FFF; @cryptpad_color_white: #FFF;
@cryptpad_color_light_green: #c5ffa8; @cryptpad_color_light_green: #c5ffa8;
@cryptpad_color_green: #5cb85c; @cryptpad_color_green: #5cb85c;
@cryptpad_color_light_yellow: #FFE69C;
@cryptpad_color_link: #0275D8; @cryptpad_color_link: #0275D8;
@ -203,7 +204,7 @@
@cp_buttons-cancel-border: #949494; @cp_buttons-cancel-border: #949494;
// Sidebar layout // Sidebar layout
@cp_sidebar-left-bg: @cryptpad_color_grey; @cp_sidebar-left-bg: @cryptpad_color_toolbar_grey;
@cp_sidebar-left-fg: @cryptpad_color_black; @cp_sidebar-left-fg: @cryptpad_color_black;
@cp_sidebar-left-active: @cryptpad_color_white; @cp_sidebar-left-active: @cryptpad_color_white;
@cp_sidebar-right-bg: @cryptpad_color_white; @cp_sidebar-right-bg: @cryptpad_color_white;
@ -216,6 +217,7 @@
@cp_drive-header-fg: @cryptpad_color_dark_grey; @cp_drive-header-fg: @cryptpad_color_dark_grey;
@cp_drive-icon-hover: @cryptpad_color_grey; @cp_drive-icon-hover: @cryptpad_color_grey;
@cp_drive-icon-border: @cryptpad_color_neutral2_grey; @cp_drive-icon-border: @cryptpad_color_neutral2_grey;
@cp_drive-thumb-bg: @cryptpad_color_white;
@cp_drive-selected-bg: @cryptpad_color_dark_grey; @cp_drive-selected-bg: @cryptpad_color_dark_grey;
@cp_drive-selected-fg: contrast(@cp_drive-droppable-bg, @cryptpad_text_col, @cryptpad_color_light_grey); @cp_drive-selected-fg: contrast(@cp_drive-droppable-bg, @cryptpad_text_col, @cryptpad_color_light_grey);
@cp_drive-selection-overlay: fade(@cryptpad_color_black, 70%); @cp_drive-selection-overlay: fade(@cryptpad_color_black, 70%);
@ -347,6 +349,7 @@
// Apps // Apps
@cp_app-bg: @cryptpad_color_light_grey; @cp_app-bg: @cryptpad_color_light_grey;
@cp_app-fg: @cryptpad_text_col;
// Accounts // Accounts
@cp_accounts-basic: @cryptpad_color_basic; @cp_accounts-basic: @cryptpad_color_basic;
@ -405,4 +408,42 @@
@cp_notif-bg: @cryptpad_color_lighter_grey; @cp_notif-bg: @cryptpad_color_lighter_grey;
@cp_notif-fg: @cryptpad_text_col; @cp_notif-fg: @cryptpad_text_col;
// XXX OO OO OO OO OO // OO
@cp_oo-offline-overlay: fade(@cryptpad_color_white, 50%);
// Rich text
@cp_pad-fg: @cryptpad_text_col;
@cp_pad-icon-filter: none;
// Poll
@cp_poll-th-bg: @cryptpad_color_lighter_blue;
@cp_poll-th-fg: @cryptpad_text_col;
@cp_poll-uncommitted-bg: @cryptpad_color_toolbar_grey;
@cp_poll-border-color: @cryptpad_color_hint_grey;
@cp_poll-cell-fg: @cryptpad_text_col;
@cp_poll-unset: @cryptpad_color_help_grey;
@cp_poll-yes: @cryptpad_color_light_green;
@cp_poll-no: @cryptpad_color_light_red;
@cp_poll-maybe: @cryptpad_color_light_yellow;
@cp_poll-hint: @cryptpad_color_dark_grey;
// Profile
@cp_profile-border: @cryptpad_color_help_grey;
@cp_profile-hint: @cryptpad_color_hint_grey;
// SLide
@cp_slide-fg: @cp_app-fg;
@cp_slide-css-error: @cryptpad_color_toolbar_grey;
// Teams
@cp_teams-card-bg: @cryptpad_color_grey;
@cp_teams-leftside-bg: @cryptpad_color_grey;
@cp_teams-invite-bg: fade(@colortheme_logo-2, 50%);
@cp_teams-invite-fg: @cryptpad_text_col;
@cp_teams-roster-odd: fade(@cryptpad_text_col, 15%);
// Whiteboard
@cp_whiteboard-board-bg: @cryptpad_color_white;
@cp_whiteboard-board-border: @cryptpad_color_hint_grey;
@cp_whiteboard-bg: @cp_app-bg;
@cp_whiteboard-fg: @cryptpad_text_col;

1
customize.dist/src/less2/include/drive.less
Unescape Escape View File

@ -582,6 +582,7 @@
.cp-app-drive-element-thumbnail { .cp-app-drive-element-thumbnail {
max-width: 100px; max-width: 100px;
max-height: 100px; max-height: 100px;
background: @cp_drive-thumb-bg;
& ~ .fa, & ~ .cptools { & ~ .fa, & ~ .cptools {
display: inline; display: inline;
font-size: 17px; font-size: 17px;

6
customize.dist/src/less2/include/loading.less
Unescape Escape View File

@ -116,12 +116,12 @@
flex-shrink: 1; flex-shrink: 1;
min-width: 0; min-width: 0;
} }
.cp-password-reveal{ .cp-password-reveal {
padding: 0px 24px; padding: 0px 24px;
} }
} }
.cp-password-input { .cp-password-input {
font-size:16px; font-size: 16px;
} }
.tools_placeholder-color(); .tools_placeholder-color();
} }
@ -164,7 +164,7 @@
i { i {
width: 22px; width: 22px;
} }
span{ span {
margin-left: 10px; margin-left: 10px;
&.percent { &.percent {
position: absolute; position: absolute;

3
customize.dist/src/less2/include/support.less
Unescape Escape View File

@ -11,6 +11,9 @@
width: @sidebar_button-width; width: @sidebar_button-width;
margin-bottom: 10px; margin-bottom: 10px;
} }
hr {
border-color: @msg-bg;
}
textarea { textarea {
width: 2*@sidebar_button-width; width: 2*@sidebar_button-width;
max-width: 90%; max-width: 90%;

6
www/common/onlyoffice/app-oo.less
Unescape Escape View File

@ -46,14 +46,14 @@ body.cp-app-sheet, body.cp-app-oodoc, body.cp-app-ooslide {
#cp-app-oo-container { #cp-app-oo-container {
flex: 1; flex: 1;
height: 100%; height: 100%;
background-color: lightgrey; background-color: @cp_app-bg;
display: flex; display: flex;
min-height: 0; min-height: 0;
} }
#cp-app-oo-editor { #cp-app-oo-editor {
flex: 1; flex: 1;
height: 100%; height: 100%;
background-color: lightgrey; background-color: @cp_app-bg;
display: flex; display: flex;
flex-flow: column; flex-flow: column;
position: relative; position: relative;
@ -67,7 +67,7 @@ body.cp-app-sheet, body.cp-app-oodoc, body.cp-app-ooslide {
bottom: 0; bottom: 0;
right: 0; right: 0;
left: 0; left: 0;
background-color: rgba(255,255,255,0.5); background-color: @cp_oo-offline-overlay;
} }
#ooframe { #ooframe {
flex: 1; flex: 1;

2
www/debug/main.js
Unescape Escape View File

@ -23,8 +23,6 @@ define([
UI: UI UI: UI
}; };
var requireConfig = RequireConfig();
// Loaded in load #2 // Loaded in load #2
nThen(function (waitFor) { nThen(function (waitFor) {
$(waitFor()); $(waitFor());

27
www/pad/app-pad.less
Unescape Escape View File

@ -7,7 +7,9 @@ body.cp-app-pad {
@bg-color: @colortheme_apps[pad], @bg-color: @colortheme_apps[pad],
); );
@bg-color: #e3e3e3; @bg-color: @cp_app-bg;
@toolbar-bg-active: contrast(@cp_toolbar-bg, darken(@cp_toolbar-bg, 10%), lighten(@cp_toolbar-bg, 10%));
display: flex; display: flex;
flex-flow: column; flex-flow: column;
@ -29,7 +31,7 @@ body.cp-app-pad {
margin-top: 10px; margin-top: 10px;
margin-left: 10px; margin-left: 10px;
width: 200px; width: 200px;
color: @cryptpad_text_col; color: @cp_pad-fg;
h2 { h2 {
font-size: 1.5rem; font-size: 1.5rem;
} }
@ -39,7 +41,7 @@ body.cp-app-pad {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
a { a {
color: @cryptpad_text_col; color: @cp_pad-fg;
} }
&.cp-pad-toc-2 { &.cp-pad-toc-2 {
margin-left: @toc-level-indent; margin-left: @toc-level-indent;
@ -51,7 +53,8 @@ body.cp-app-pad {
} }
.cke_toolbox_main { .cke_toolbox_main {
background-color: @colortheme_pad-toolbar-bg; background-color: @cp_toolbar-bg;
color: @cp_toolbar-fg;
.cke_toolbar { .cke_toolbar {
height: 28px; height: 28px;
padding: 2px 0; padding: 2px 0;
@ -66,8 +69,22 @@ body.cp-app-pad {
.cke_button__print { .cke_button__print {
display: none !important; display: none !important;
} }
.cke_button { .cke_combo_on .cke_combo_button {
background-color: @toolbar-bg-active;
border-color: @toolbar-bg-active;
}
.cke_button, .cke_combo_button {
.tools_unselectable(); .tools_unselectable();
&.cke_button_on, &.cke_combo_button:hover, &.cke_button_off:hover {
background-color: @toolbar-bg-active;
border-color: @toolbar-bg-active;
}
.cke_combo_text {
color: @cp_toolbar-fg;
}
.cke_button_icon {
filter: @cp_pad-icon-filter;
}
} }
} }
.cke_wysiwyg_frame { .cke_wysiwyg_frame {

96
www/poll/app-poll.less
Unescape Escape View File

@ -11,8 +11,8 @@
@poll-fore: #555; @poll-fore: #555;
@poll-th-bg: @colortheme_poll-th-bg; @poll-th-bg: @cp_poll-th-bg;
@poll-th-fg: @colortheme_poll-th-fg; @poll-th-fg: @cp_poll-th-fg;
@poll-th-user-bg: darken(@poll-th-bg, 10%); @poll-th-user-bg: darken(@poll-th-bg, 10%);
@poll-editing: lighten(@poll-th-bg, 10%); @poll-editing: lighten(@poll-th-bg, 10%);
@poll-winner: darken(@poll-th-bg, 15%); @poll-winner: darken(@poll-th-bg, 15%);
@ -20,22 +20,15 @@
@poll-td-bg: @poll-th-bg; @poll-td-bg: @poll-th-bg;
@poll-td-fg: @poll-th-fg; @poll-td-fg: @poll-th-fg;
@poll-help-bg: @colortheme_poll-help-bg; @poll-uncommitted-cell: @cp_poll-uncommitted-bg;
@poll-uncommitted-text: @cp_poll-cell-fg;
@poll-cover-color: @cp_poll-cell-fg;
@poll-uncommitted-cell: #eee; @poll-border-color: @cp_poll-border-color;
@poll-uncommitted-bg: #ddd; //lighten(@poll-th-bg, 50%); @poll-option-green: @cp_poll-yes;
@poll-uncommitted-text: black; @poll-option-red: @cp_poll-no;
@poll-option-yellow: @cp_poll-maybe;
@poll-placeholder: #fff; @poll-option-gray: @cp_poll-unset;
@poll-border-color: #555;
@poll-cover-color: #000;
@poll-fg: #000;
@poll-option-yellow: #ff5;
@poll-option-gray: #ccc;
@poll-add-color: #fff;
@poll-add-bg: #777;
@poll-add-bg-alt: #444;
.bottom-left(@s: 5px) { border-bottom-left-radius: @s; } .bottom-left(@s: 5px) { border-bottom-left-radius: @s; }
.top-left(@s: 5px) { border-top-left-radius: @s; } .top-left(@s: 5px) { border-top-left-radius: @s; }
@ -80,8 +73,6 @@
} }
input[type="text"], textarea { input[type="text"], textarea {
background-color: white;
color: black;
border: 0; border: 0;
} }
@ -92,8 +83,9 @@
// The placeholder color only seems to effect Safari when not set // The placeholder color only seems to effect Safari when not set
// XXX placeholder in forms.less
input[type="text"][disabled]::placeholder { input[type="text"][disabled]::placeholder {
color: @poll-placeholder; color: @poll-th-fg;
opacity: 1; opacity: 1;
} }
@ -107,7 +99,6 @@
} }
#cp-app-poll-table-container button { #cp-app-poll-table-container button {
border-radius: 0; border-radius: 0;
border: 0;
} }
#cp-app-poll-create-user { #cp-app-poll-create-user {
display: inline-flex; display: inline-flex;
@ -116,11 +107,6 @@
margin: 2px auto; margin: 2px auto;
width: auto; width: auto;
overflow: hidden; overflow: hidden;
color: @poll-add-color;
background: @poll-add-bg;
&:hover {
background: @poll-add-bg-alt;
}
} }
#cp-app-poll-create-option { #cp-app-poll-create-option {
order: 3; order: 3;
@ -129,11 +115,6 @@
height: 20px; height: 20px;
margin: 2px; margin: 2px;
padding: 0; padding: 0;
color: @poll-add-color;
background: @poll-add-bg;
&:hover {
background: @poll-add-bg-alt;
}
} }
#cp-app-poll-table-scroll { #cp-app-poll-table-scroll {
overflow-y: hidden; overflow-y: hidden;
@ -155,7 +136,7 @@
width: 80%; width: 80%;
min-height: 200px; min-height: 200px;
height: 200px; height: 200px;
border: 1px solid black; border: 1px solid @cp_forms-border;
.CodeMirror-placeholder { .CodeMirror-placeholder {
color: #777; color: #777;
} }
@ -169,9 +150,9 @@
min-width: 80%; min-width: 80%;
width: 80%; width: 80%;
min-height: 7em; min-height: 7em;
color: #000; color: @poll-uncommitted-text;
border: 1px solid transparent; border: 1px solid transparent;
background-color: #eeeeee; background-color: @poll-uncommitted-cell;
font: @colortheme_app-font; font: @colortheme_app-font;
text-align: left; text-align: left;
media-tag > * { media-tag > * {
@ -202,13 +183,6 @@
} }
} }
#cp-app-poll-help {
width: 100%;
margin: auto;
padding: 20px 10%;
background: @poll-help-bg;
}
// from cryptpad.less // from cryptpad.less
#cp-app-poll-table-container { #cp-app-poll-table-container {
@ -277,11 +251,11 @@
background-color: @poll-uncommitted-cell !important; background-color: @poll-uncommitted-cell !important;
} }
div.cp-app-poll-table-text-cell { div.cp-app-poll-table-text-cell {
background-color: @poll-uncommitted-bg !important; background-color: @poll-uncommitted-cell !important;
color: @poll-uncommitted-text !important; color: @poll-uncommitted-text !important;
} }
text-align: center; text-align: center;
background-color: @poll-uncommitted-bg !important; background-color: @poll-uncommitted-cell !important;
color: @poll-uncommitted-text !important; color: @poll-uncommitted-text !important;
} }
tr { tr {
@ -389,13 +363,13 @@
input[type="number"][value="0"] { input[type="number"][value="0"] {
~ .cp-app-poll-table-cover { ~ .cp-app-poll-table-cover {
background-color: @colortheme_cp-red; background-color: @poll-option-red;
&:after { content: "✖"; } &:after { content: "✖"; }
} }
} }
input[type="number"][value="1"] { input[type="number"][value="1"] {
~ .cp-app-poll-table-cover { ~ .cp-app-poll-table-cover {
background-color: @colortheme_cp-green; background-color: @poll-option-green;
&:after { content: "✔"; } &:after { content: "✔"; }
} }
} }
@ -530,35 +504,13 @@
margin-left: 10px; margin-left: 10px;
} }
thead {
tr {
th {
input[type="text"][disabled] {
background-color: transparent;
color: @poll-fore;
font-weight: bold;
}
.cp-app-poll-table-remove {
cursor: pointer;
font-size: 20px;
}
}
}
}
tbody {
tr {
td {
}
}
}
tfoot { tfoot {
display: none; display: none;
} }
} }
} }
#cp-app-poll-nocomments { #cp-app-poll-nocomments {
color: #999; color: @cp_poll-hint;
text-align: center; text-align: center;
margin: 20px; margin: 20px;
font: @colortheme_app-font; font: @colortheme_app-font;
@ -574,7 +526,7 @@
} }
#cp-app-poll-comments-add { #cp-app-poll-comments-add {
input, textarea { input, textarea {
border: 1px solid black; border: 1px solid @cp_forms-border;
width: 90%; width: 90%;
margin: 5px 5%; margin: 5px 5%;
} }
@ -582,7 +534,7 @@
padding: 5px; padding: 5px;
height: 26px; height: 26px;
&[disabled] { &[disabled] {
background: #eee; background: @poll-uncommitted-cell;
} }
} }
textarea { textarea {
@ -602,7 +554,7 @@
} }
.cp-app-poll-comments-list-msg { .cp-app-poll-comments-list-msg {
display: flex; display: flex;
background: #eee; background: @poll-uncommitted-cell;
padding: 5px 10px; padding: 5px 10px;
.cp-app-poll-comments-list-msg-text { .cp-app-poll-comments-list-msg-text {
flex: 1; flex: 1;
@ -617,7 +569,7 @@
} }
} }
.cp-app-poll-comments-list-data { .cp-app-poll-comments-list-data {
background: #ddd; background: @poll-option-gray;
padding: 5px 10px; padding: 5px 10px;
display: flex; display: flex;
align-items: center; align-items: center;

4
www/poll/inner.js
Unescape Escape View File

@ -1263,10 +1263,10 @@ define([
]), ]),
h('div#cp-app-poll-table-container', [ h('div#cp-app-poll-table-container', [
h('div#cp-app-poll-table-scroll', [h('table')]), h('div#cp-app-poll-table-scroll', [h('table')]),
h('button#cp-app-poll-create-user.btn.btn-secondary', { h('button#cp-app-poll-create-user.btn.btn-default', {
title: Messages.poll_create_user title: Messages.poll_create_user
}, Messages.poll_commit), }, Messages.poll_commit),
h('button#cp-app-poll-create-option.btn.btn-secondary', { h('button#cp-app-poll-create-option.btn.btn-default', {
title: Messages.poll_create_option title: Messages.poll_create_option
}, h('span.fa.fa-plus')), }, h('span.fa.fa-plus')),
]), ]),

6
www/profile/app-profile.less
Unescape Escape View File

@ -6,7 +6,7 @@
.framework_min_main(); .framework_min_main();
.sidebar-layout_main(); .sidebar-layout_main();
@cp-profile-is-your-friend: #777; @cp-profile-is-your-friend: @cp_profile-hint;
display: flex; display: flex;
flex-flow: column; flex-flow: column;
@ -35,7 +35,7 @@
text-align: center; text-align: center;
height: 300px; height: 300px;
width: 300px; width: 300px;
border: 1px solid black; border: 1px solid @cp_profile-border;
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
@ -151,7 +151,7 @@
display: none; display: none;
} }
.cp-app-profile-description-rendered { .cp-app-profile-description-rendered {
border: 1px solid #DDD; border: 1px solid @cp_profile-border;
padding: 0 15px; padding: 0 15px;
&:empty { &:empty {
display: none; display: none;

11
www/secureiframe/app-secure.less
Unescape Escape View File

@ -56,15 +56,14 @@
line-height: 1em; line-height: 1em;
cursor: pointer; cursor: pointer;
background-color: @colortheme_modal-bg; background: @cp_drive-bg;
color: @cp_drive-fg;
border: 1px solid @colortheme_logo-2; border: 1px solid @cp_drive-icon-border;
color: @colortheme_logo-2;
transition: all 0.1s; transition: all 0.1s;
&:hover { &:hover {
color: @colortheme_modal-fg; background: @cp_drive-icon-hover;
} }
align-items: center; align-items: center;
@ -72,7 +71,7 @@
img { img {
max-width: 100px; max-width: 100px;
max-height: 100px; max-height: 100px;
background: #fff; background: @cp_drive-thumb-bg;
} }
.cp-filepicker-content-element-name { .cp-filepicker-content-element-name {

3
www/secureiframe/main.js
Unescape Escape View File

@ -17,10 +17,13 @@ define([
$(waitFor()); $(waitFor());
}).nThen(function (waitFor) { }).nThen(function (waitFor) {
var lang = Messages._languageUsed; var lang = Messages._languageUsed;
var themeKey = 'CRYPTPAD_STORE|colortheme';
var req = { var req = {
cfg: requireConfig, cfg: requireConfig,
req: [ '/common/loading.js' ], req: [ '/common/loading.js' ],
pfx: window.location.origin, pfx: window.location.origin,
theme: localStorage[themeKey],
themeOS: localStorage[themeKey+'_default'],
lang: lang lang: lang
}; };
window.rc = requireConfig; window.rc = requireConfig;

79
www/settings/app-settings.less
Unescape Escape View File

@ -48,12 +48,6 @@
width: @sidebar_button-width; width: @sidebar_button-width;
max-width: 100%; max-width: 100%;
margin: 0 !important; margin: 0 !important;
background-color: @colortheme_sidebar-button-alt-bg;
border-color: #adadad;
color: black;
&:hover {
background-color: darken(@colortheme_sidebar-button-alt-bg, 15%);
}
} }
} }
.cp-sidebarlayout-input-block { .cp-sidebarlayout-input-block {
@ -108,79 +102,6 @@
margin-right: 5px; margin-right: 5px;
} }
} }
.cp-settings-creation-owned, .cp-settings-creation-expire,
.cp-settings-creation-skip, .cp-settings-creation-template {
input[type="radio"] {
display: none;
&:checked {
& + label {
font-weight: bold;
background-color: @colortheme_logo-2;
cursor: default;
border: 1px solid @colortheme_logo-2;
color: @colortheme_loading-color;
&:hover {
background-color: @colortheme_logo-2;
}
}
}
}
input[type="radio"] + label {
.tools_unselectable();
display: inline-flex;
align-items: center;
justify-content: center;
width: 200px;
height: 50px;
padding: 5px;
margin: 0 20px;
color: @colortheme_logo-2;
border: 1px solid @colortheme_logo-2;
cursor: pointer;
&:hover {
background-color: lighten(@colortheme_logo-2, 35%);
}
}
.fa {
margin-left: 50px;
}
}
.cp-settings-creation-skipped {
display: none !important; // we have to override an inline style attribute
}
.cp-settings-creation-expire {
#cp-creation-expire-true {
display: none;
&:checked {
& + label {
height: 100px;
.cp-creation-expire-picker {
display: inline;
}
}
}
}
label[for="cp-creation-expire-true"] {
flex-wrap: wrap;
.cp-creation-expire-picker {
display: none;
}
input {
width: 70px;
padding: 0 5px;
}
select {
width: 100px;
}
input, select {
border: none;
height: 30px;
background: @colortheme_loading-bg;
color: @colortheme_loading-color;
border-radius: 3px;
}
}
}
} }
} }

21
www/slide/app-slide.less
Unescape Escape View File

@ -10,7 +10,7 @@
@bg-color: @colortheme_apps[slide] @bg-color: @colortheme_apps[slide]
); );
@slide-default-bg: #e3e3e3; @slide-default-bg: @cp_app-bg;
// body // body
font-size: unset; font-size: unset;
@ -71,13 +71,6 @@
overflow: hidden; overflow: hidden;
.CodeMirror { .CodeMirror {
resize: none; resize: none;
//width: 100vw;
}
&.cp-app-slide-preview {
.CodeMirror {
//resize: horizontal;
//width: 50vw;
}
} }
} }
.cp-app-slide-shown { .cp-app-slide-shown {
@ -142,8 +135,6 @@
height: 28.125vw; // height:width ratio = 9/16 = .5625 height: 28.125vw; // height:width ratio = 9/16 = .5625
max-height: ~"calc(100vh - 96px)"; max-height: ~"calc(100vh - 96px)";
max-width: ~"calc(16 / 9 * (100vh - 96px))"; max-width: ~"calc(16 / 9 * (100vh - 96px))";
//max-height: 100vh;
//max-width: 177.78vh; // 16/9 = 1.778
} }
} }
#cp-app-slide-modal-exit { #cp-app-slide-modal-exit {
@ -180,7 +171,7 @@
flex-flow: column; flex-flow: column;
padding: 0.5em; padding: 0.5em;
margin: auto; margin: auto;
border: 1px solid black; border: 1px solid @cp_slide-fg;
height: @ratio*56.25vw; height: @ratio*56.25vw;
width: @ratio*100vw; width: @ratio*100vw;
page-break-after: always; page-break-after: always;
@ -227,8 +218,7 @@
/* Slide position (present mode) */ /* Slide position (present mode) */
div#cp-app-slide-modal { div#cp-app-slide-modal {
display: none; display: none;
background-color: black; background-color: @slide-default-bg;
color: white;
.cp-app-slide-isempty { .cp-app-slide-isempty {
display: flex; display: flex;
@ -325,8 +315,6 @@
width: 100%; width: 100%;
height: 100vh; height: 100vh;
display: none; display: none;
background-color: @slide-default-bg;
} }
/* Slide content */ /* Slide content */
@ -433,6 +421,7 @@
} }
pre.cp-slide-css-error { pre.cp-slide-css-error {
color: white; background: @cp_slide-css-error;
color: @cp_slide-fg;
} }
} }

2
www/support/app-support.less
Unescape Escape View File

@ -26,7 +26,7 @@
.cp-support-language-list { .cp-support-language-list {
.cp-support-language { .cp-support-language {
margin-left: 5px; margin-left: 5px;
background-color: rgba(0, 0, 0, 0.1); background-color: @cp_token-bg;
padding: 0 5px; padding: 0 5px;
} }
} }

46
www/teams/app-team.less
Unescape Escape View File

@ -18,7 +18,9 @@
); );
.sidebar-layout_main(); .sidebar-layout_main();
@roster-bg-color: #efefef; @roster-bg-color: @cp_teams-card-bg;
@roster-bg-color-hover: contrast(@roster-bg-color, darken(@roster-bg-color, 5%), lighten(@roster-bg-color, 5%));
@roster-bg-color-hover2: contrast(@roster-bg-color, darken(@roster-bg-color, 10%), lighten(@roster-bg-color, 10%));
.export_main(); .export_main();
@ -34,7 +36,7 @@
} }
} }
div#cp-sidebarlayout-leftside { div#cp-sidebarlayout-leftside {
background-color: #e0e0e0; background-color: @cp_teams-leftside-bg;
} }
div#cp-sidebarlayout-rightside.cp-rightside-drive { div#cp-sidebarlayout-rightside.cp-rightside-drive {
padding: 0; padding: 0;
@ -48,7 +50,6 @@
.cp-app-contacts-input { .cp-app-contacts-input {
textarea { textarea {
border: 0px; border: 0px;
color: @cryptpad_text_col;
} }
} }
} }
@ -110,17 +111,23 @@
background-color: @roster-bg-color; background-color: @roster-bg-color;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
flex-flow: column; flex-flow: column;
width: 300px; width: 300px;
max-width: 90%; max-width: 90%;
height: 400px; height: 384px;
padding: 20px; padding: 50px;
margin: 5px; margin: 5px;
&.create, &:not(.empty) {
cursor: pointer;
&:hover {
background-color: @roster-bg-color-hover;
}
}
.cp-team-list-avatar { .cp-team-list-avatar {
.avatar_main(200px); .avatar_main(200px);
} }
.cp-team-list-name { .cp-team-list-name {
flex: 1;
min-width: 0; min-width: 0;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
@ -134,6 +141,23 @@
text-align: center; text-align: center;
} }
} }
&.empty {
justify-content: unset;
.cp-team-list-name {
flex: unset;
font-size: 20px;
height: 150px;
}
}
.cp-team-list-team-create {
font-size: 25px;
display: flex;
align-items: center;
flex-flow: column;
i {
font-size: 40px;
}
}
.cp-team-list-open { .cp-team-list-open {
width: 100%; width: 100%;
} }
@ -165,7 +189,7 @@
max-width: 500px; max-width: 500px;
background-color: @roster-bg-color; background-color: @roster-bg-color;
&:hover { &:hover {
background-color: darken(@roster-bg-color, 5%); background-color: @roster-bg-color-hover;
} }
.cp-avatar { .cp-avatar {
margin-right: 10px; margin-right: 10px;
@ -196,7 +220,7 @@
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: darken(@roster-bg-color, 10%); background-color: @roster-bg-color-hover2;
} }
} }
} }
@ -217,8 +241,8 @@
} }
} }
.cp-teams-invite-message { .cp-teams-invite-message {
background-color: fade(@colortheme_logo-2, 25%); background-color: @cp_teams-invite-bg;
color: @cryptpad_text_col; color: @cp_teams-invite-fg;
resize: none; resize: none;
width: 100%; width: 100%;
padding: 12px; padding: 12px;
@ -243,7 +267,7 @@
margin-top: 30px; margin-top: 30px;
} }
tr:nth-child(even) { tr:nth-child(even) {
background-color: fade(@colortheme_modal-dim, 25%); background-color: @cp_teams-roster-odd;
} }
} }
p { p {

37
www/teams/inner.js
Unescape Escape View File

@ -132,6 +132,9 @@ define([
APP.teamEdPublic = null; APP.teamEdPublic = null;
APP.drive = null; APP.drive = null;
APP.cryptor = null; APP.cryptor = null;
APP.toolbar.$bottomR.empty();
APP.toolbar.$bottomM.empty();
APP.toolbar.$bottomL.empty();
APP.buildUI(common); APP.buildUI(common);
if (APP.usageBar) { if (APP.usageBar) {
APP.usageBar.stop(); APP.usageBar.stop();
@ -403,6 +406,12 @@ define([
}); });
}); });
}; };
var canCreateTeams = function (teams) {
var owned = Object.keys(teams || {}).filter(function (id) {
return teams[id].owner;
}).length;
return Constants.MAX_TEAMS_OWNED - owned;
};
var refreshList = function (common, cb) { var refreshList = function (common, cb) {
var content = []; var content = [];
APP.module.execCommand('LIST_TEAMS', null, function (obj) { APP.module.execCommand('LIST_TEAMS', null, function (obj) {
@ -412,6 +421,7 @@ define([
var list = []; var list = [];
var keys = Object.keys(obj).slice(0,MAX_TEAMS_SLOTS); var keys = Object.keys(obj).slice(0,MAX_TEAMS_SLOTS);
var slots = '('+Math.min(keys.length, MAX_TEAMS_SLOTS)+'/'+MAX_TEAMS_SLOTS+')'; var slots = '('+Math.min(keys.length, MAX_TEAMS_SLOTS)+'/'+MAX_TEAMS_SLOTS+')';
var createSlots = canCreateTeams(obj);
for (var i = keys.length; i < MAX_TEAMS_SLOTS; i++) { for (var i = keys.length; i < MAX_TEAMS_SLOTS; i++) {
obj[i] = { obj[i] = {
empty: true empty: true
@ -421,8 +431,10 @@ define([
content.push(h('h3', Messages.team_listTitle + ' ' + slots)); content.push(h('h3', Messages.team_listTitle + ' ' + slots));
console.error(createSlots, Constants);
APP.teams = {}; APP.teams = {};
var created = 0;
keys.forEach(function (id) { keys.forEach(function (id) {
if (!obj[id].empty) { if (!obj[id].empty) {
APP.teams[id] = { APP.teams[id] = {
@ -431,23 +443,34 @@ define([
} }
var team = obj[id]; var team = obj[id];
var createBtn;
var createCls = '';
if (team.empty && created < createSlots) {
createBtn = h('div.cp-team-list-team-create', [
h('i.fa.fa-plus-circle'),
h('span', Messages.team_cat_create)
]);
createCls = '.create';
created++;
}
if (team.empty) { if (team.empty) {
list.push(h('div.cp-team-list-team.empty', [ list.push(h('div.cp-team-list-team.empty'+createCls, [
h('span.cp-team-list-name.empty', Messages.team_listSlot) h('span.cp-team-list-name.empty', Messages.team_listSlot),
createBtn
])); ]));
return; return;
} }
var btn;
var avatar = h('span.cp-avatar'); var avatar = h('span.cp-avatar');
list.push(h('div.cp-team-list-team', [ var teamDiv = h('div.cp-team-list-team', [
h('span.cp-team-list-avatar', avatar), h('span.cp-team-list-avatar', avatar),
h('span.cp-team-list-name', { h('span.cp-team-list-name', {
title: team.metadata.name title: team.metadata.name
}, team.metadata.name), }, team.metadata.name),
btn = h('button.cp-team-list-open.btn.btn-primary', Messages.team_listLoad) ]);
])); list.push(teamDiv);
common.displayAvatar($(avatar), team.metadata.avatar, team.metadata.name); common.displayAvatar($(avatar), team.metadata.avatar, team.metadata.name);
$(btn).click(function () { $(teamDiv).click(function () {
if (team.error) { if (team.error) {
UI.warn(Messages.error); // FIXME better error message - roster bug, can't load the team for now UI.warn(Messages.error); // FIXME better error message - roster bug, can't load the team for now
return; return;

13
www/whiteboard/app-whiteboard.less
Unescape Escape View File

@ -33,6 +33,7 @@
display: flex; display: flex;
overflow: auto; overflow: auto;
flex-flow: column; flex-flow: column;
background: @cp_whiteboard-board-bg;
} }
// created in the html // created in the html
@ -45,12 +46,11 @@
.cp-app-whiteboard-canvas-container { .cp-app-whiteboard-canvas-container {
width: 100%; width: 100%;
margin: auto; margin: auto;
background: white;
flex: 1; flex: 1;
min-height: 0; min-height: 0;
& > canvas { & > canvas {
width: 100%; width: 100%;
border: 1px solid black; border: 1px solid @cp_whiteboard-board-border;
} }
} }
@ -66,8 +66,9 @@
justify-content: center; justify-content: center;
position: relative; position: relative;
border-top: 1px solid black; border-top: 1px solid @cp_whiteboard-board-border;
background: white; background: @cp_whiteboard-bg;
color: @cp_whiteboard-fg;
padding: 10px; padding: 10px;
@ -145,7 +146,7 @@
#cp-app-whiteboard-colors { #cp-app-whiteboard-colors {
.middle; .middle;
z-index: 100; z-index: 100;
background: white; background: @cp_whiteboard-bg;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
max-width: 320px; max-width: 320px;
@ -155,7 +156,7 @@
width: 30px; width: 30px;
display: block; display: block;
margin: 5px; margin: 5px;
border: 1px solid #bbb; border: 1px solid @cp_whiteboard-board-border;
vertical-align: top; vertical-align: top;
border-radius: 50%; border-radius: 50%;
cursor: pointer; cursor: pointer;

2
www/whiteboard/inner.js
Unescape Escape View File

@ -88,7 +88,7 @@ define([
ctx.moveTo(size/2, size); ctx.lineTo(size/2, size-10); ctx.moveTo(size/2, size); ctx.lineTo(size/2, size-10);
ctx.moveTo(0, size/2); ctx.lineTo(10, size/2); ctx.moveTo(0, size/2); ctx.lineTo(10, size/2);
ctx.moveTo(size, size/2); ctx.lineTo(size-10, size/2); ctx.moveTo(size, size/2); ctx.lineTo(size-10, size/2);
ctx.strokeStyle = '#000000'; ctx.strokeStyle = window.CryptPad_theme === 'dark' ? '#FFFFFF' : '#000000';
ctx.stroke(); ctx.stroke();
var img = ccanvas.toDataURL("image/png"); var img = ccanvas.toDataURL("image/png");

Write Preview
Loading…
Cancel
Save