diff --git a/customize.dist/src/less2/include/colortheme-dark.less b/customize.dist/src/less2/include/colortheme-dark.less index a0fee30c1..fc17d7d24 100644 --- a/customize.dist/src/less2/include/colortheme-dark.less +++ b/customize.dist/src/less2/include/colortheme-dark.less @@ -31,16 +31,6 @@ @cryptpad_color_brand_fader: fade(@cryptpad_color_brand, 50%); @cryptpad_color_brand_fadest: fade(@cryptpad_color_brand, 25%); -@cryptpad_color_hint_grey: #777; -@cryptpad_color_dark_grey: #999999; -@cryptpad_color_neutral_grey: #aaaaaa; -@cryptpad_color_neutral2_grey: #cccccc; -@cryptpad_color_help_grey: #dddddd; -@cryptpad_color_grey: #e0e0e0; -@cryptpad_color_toolbar_grey: #EEEEEE; -@cryptpad_color_light_grey: #f1f1f1; -@cryptpad_color_lighter_grey: #f9f9f9; - @cryptpad_color_white: #FFF; @cryptpad_color_grey_50: #FAFAFA; @cryptpad_color_grey_100: #F5F5F5; @@ -278,8 +268,8 @@ // Support @cp_support-bg: @cryptpad_color_grey_800; @cp_support-msg-fg: @cryptpad_text_col; -@cp_support-msg-bg: @cryptpad_color_grey_900; -@cp_support-header-bg: @cryptpad_color_grey_800; +@cp_support-msg-bg: @cryptpad_color_grey_700; +@cp_support-header-bg: @cryptpad_color_grey_700; // Toolbar @cp_toolbar-bg: @cryptpad_color_grey_850; @@ -328,13 +318,11 @@ @cp_accounts-tab-hover: @cryptpad_color_grey_700; @cp_accounts-tab-border: @cryptpad_color_grey_600; -// Admin -@cp_admin-isadmin-fg: @cryptpad_color_brand; -@cp_admin-isadmin-bg: @cryptpad_color_white; -@cp_admin-premium-fg: @cryptpad_color_light_red; +// Admin Support +@cp_admin-isadmin-bg: @cryptpad_color_brand_fadest; @cp_admin-premium-bg: @cryptpad_color_red_fader; -@cp_admin-last-fg: @cryptpad_color_light_red; -@cp_admin-last-bg: @cryptpad_color_red_fader; +@cp_admin-last-fg: @cryptpad_text_col; +@cp_admin-last-bg: @cryptpad_color_grey_700; // Code @cp_preview-bg: @cryptpad_color_grey_900; diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less index f35f00ed1..f353758c8 100644 --- a/customize.dist/src/less2/include/colortheme.less +++ b/customize.dist/src/less2/include/colortheme.less @@ -31,16 +31,6 @@ @cryptpad_color_brand_fader: fade(@cryptpad_color_brand, 50%); @cryptpad_color_brand_fadest: fade(@cryptpad_color_brand, 25%); -@cryptpad_color_hint_grey: #777; -@cryptpad_color_dark_grey: #999999; -@cryptpad_color_neutral_grey: #aaaaaa; -@cryptpad_color_neutral2_grey: #cccccc; -@cryptpad_color_help_grey: #dddddd; -@cryptpad_color_grey: #e0e0e0; -@cryptpad_color_toolbar_grey: #EEEEEE; -@cryptpad_color_light_grey: #f1f1f1; -@cryptpad_color_lighter_grey: #f9f9f9; - @cryptpad_color_white: #FFF; @cryptpad_color_grey_50: #FAFAFA; @cryptpad_color_grey_100: #F5F5F5; @@ -76,7 +66,7 @@ @cryptpad_color_yellow_fade: fade(#FFE69C, 50%); // different from dark @cryptpad_color_lighter_blue: #d2e1f2; -@cryptpad_color_link: #0275D8; +@cryptpad_color_link: @cryptpad_color_brand; // Premium plans colors @cryptpad_color_basic: #DDEFFF; @@ -112,7 +102,7 @@ @cp_alertify-log-bg: fade(@cryptpad_color_brand, 90%); @cp_alertify-log-fg: @cryptpad_color_white; @cp_alertify-warn-bg: rgba(205, 37, 50); -@cp_alertify-disable-border: @cryptpad_color_dark_grey; +@cp_alertify-disable-border: @cryptpad_color_grey_500; // Forms @cp_forms-fg: @cryptpad_text_col; @@ -157,18 +147,18 @@ @cp_buttons-cancel-border: #949494; // Sidebar layout -@cp_sidebar-left-bg: @cryptpad_color_toolbar_grey; +@cp_sidebar-left-bg: @cryptpad_color_grey_200; @cp_sidebar-left-fg: @cryptpad_text_col; @cp_sidebar-right-bg: @cryptpad_color_white; @cp_sidebar-right-fg: @cryptpad_text_col; @cp_sidebar-left-active: @cp_sidebar-right-bg; -@cp_sidebar-hint: @cryptpad_color_hint_grey; +@cp_sidebar-hint: @cryptpad_color_grey_600; // Drive @cp_drive-bg: @cp_sidebar-right-bg; @cp_drive-fg: @cp_sidebar-right-fg; @cp_drive-header-fg: fade(@cryptpad_text_col, 70%); -@cp_drive-icon-hover: fade(@cryptpad_text_col, 5%); +@cp_drive-icon-hover: fade(@cryptpad_text_col, 15%); @cp_drive-icon-border: fade(@cryptpad_text_col, 20%); @cp_drive-thumb-bg: transparent; @cp_drive-selected-bg: fade(@cryptpad_text_col, 10%); @@ -199,18 +189,18 @@ // Dropdown @cp_dropdown-fg: @cryptpad_text_col; -@cp_dropdown-bg: @cryptpad_color_lighter_grey; -@cp_dropdown-bg-hover: @cryptpad_color_light_grey; -@cp_dropdown-bg-active: @cryptpad_color_grey; +@cp_dropdown-bg: @cryptpad_color_grey_100; +@cp_dropdown-bg-hover: @cryptpad_color_grey_100; +@cp_dropdown-bg-active: @cryptpad_color_grey_300; // Rendered Markdown -@cp_markdown-bg: @cryptpad_color_lighter_grey; +@cp_markdown-bg: @cryptpad_color_grey_100; @cp_markdown-border: @cryptpad_color_grey_400; @cp_markdown-block-fg: @cryptpad_text_col; @cp_markdown-block-bg: @cryptpad_color_grey_200; // Avatar -@cp_avatar-bg: @cryptpad_color_grey; +@cp_avatar-bg: @cryptpad_color_grey_300; @cp_avatar-fg: @cryptpad_text_col; // Corner @@ -224,7 +214,7 @@ @cp_creation-button-bg: @cryptpad_color_brand; @cp_creation-button-fg: @cryptpad_color_white; @cp_creation-error-bg: @cryptpad_color_blue; -@cp_creation-error-fg: @cryptpad_color_light_grey; +@cp_creation-error-fg: @cryptpad_color_grey_100; // Export @cp_export-bg: @cryptpad_color_grey_200; @@ -235,20 +225,20 @@ // File upload @cp_upload-fg: @cryptpad_color_brand; -@cp_upload-header: @cryptpad_color_help_grey; -@cp_upload-progress: @cryptpad_color_help_grey; +@cp_upload-header: @cryptpad_color_grey_300; +@cp_upload-progress: @cryptpad_color_grey_300; // Help -@cp_help-bg: @cryptpad_color_help_grey; +@cp_help-bg: @cryptpad_color_grey_300; @cp_help-fg: @cryptpad_text_col; @cp_help-link: @cryptpad_color_link; // Static pages -@cp_static-bg: @cryptpad_color_toolbar_grey; +@cp_static-bg: @cryptpad_color_grey_200; @cp_static-fg: @cryptpad_text_col; @cp_static-link: @cryptpad_color_brand; @cp_static-title: @cryptpad_color_brand; -@cp_static-footer: @cryptpad_color_help_grey; +@cp_static-footer: @cryptpad_color_grey_300; @cp_static-footer-border: @cryptpad_color_white; @cp_static-topbar-fg: @cryptpad_color_brand; @cp_static-card-bg: @cryptpad_color_white; @@ -262,8 +252,8 @@ @cp-limit-bar-above: @cryptpad_color_red; // Mentions -@cp_mentions-bg: @cryptpad_color_grey; -@cp_mentions-hover: @cryptpad_color_help_grey; +@cp_mentions-bg: @cryptpad_color_grey_300; +@cp_mentions-hover: @cryptpad_color_grey_300; // Autocomplete @cp_autocomplete-bg: @cryptpad_color_grey_100; @@ -273,13 +263,13 @@ // Modals @cp_access-overlay: fade(@cryptpad_color_white, 50%); -@cp_snapshots-hover: @cryptpad_color_help_grey; +@cp_snapshots-hover: @cryptpad_color_grey_300; // Support -@cp_support-bg: @cryptpad_color_lighter_grey; +@cp_support-bg: @cryptpad_color_grey_200; @cp_support-msg-fg: @cryptpad_text_col; -@cp_support-msg-bg: @cryptpad_color_grey; -@cp_support-header-bg: @cryptpad_color_help_grey; +@cp_support-msg-bg: @cryptpad_color_grey_300; +@cp_support-header-bg: @cryptpad_color_grey_300; // Toolbar @cp_toolbar-bg: @cryptpad_color_grey_200; @@ -297,9 +287,9 @@ @cp_history-fg: @cp_toolbar-bottom-fg; // Tokenfield -@cp_token-bg: @cryptpad_color_neutral2_grey; +@cp_token-bg: @cryptpad_color_grey_400; @cp_token-fg: @cryptpad_text_col; -@cp_token-bg-hover: @cryptpad_color_neutral_grey; +@cp_token-bg-hover: @cryptpad_color_grey_500; @cp_token-invalid: @cryptpad_color_warn_red; // Usergrid @@ -311,7 +301,7 @@ @cp_shadow-color: fade(@cryptpad_color_black, 40%); // Apps -@cp_app-bg: @cryptpad_color_light_grey; +@cp_app-bg: @cryptpad_color_grey_100; @cp_app-fg: @cryptpad_text_col; // Accounts @@ -321,20 +311,18 @@ @cp_accounts-active: @cryptpad_color_light_green; @cp_accounts-inactive: @cryptpad_color_light_red; @cp_accounts-mysubs-alert: @cryptpad_color_white; -@cp_accounts-mysubs-bg: @cryptpad_color_toolbar_grey; +@cp_accounts-mysubs-bg: @cryptpad_color_grey_200; @cp_accounts-mysubs-fg: @cryptpad_text_col; @cp_accounts-contact-hover: fade(@cryptpad_color_black, 20%); -@cp_accounts-tab-bg: @cryptpad_color_toolbar_grey; -@cp_accounts-tab-hover: @cryptpad_color_grey; -@cp_accounts-tab-border: @cryptpad_color_neutral_grey; +@cp_accounts-tab-bg: @cryptpad_color_grey_200; +@cp_accounts-tab-hover: @cryptpad_color_grey_300; +@cp_accounts-tab-border: @cryptpad_color_grey_500; // Admin -@cp_admin-isadmin-fg: @cryptpad_color_brand; -@cp_admin-isadmin-bg: @cryptpad_color_white; -@cp_admin-premium-fg: @cryptpad_color_warn_red; -@cp_admin-premium-bg: lighten(@cryptpad_color_warn_red, 25%); -@cp_admin-last-fg: @cryptpad_color_warn_red; -@cp_admin-last-bg: lighten(@cryptpad_color_orange, 25%); +@cp_admin-isadmin-bg: @cryptpad_color_brand_fadest; +@cp_admin-premium-bg: @cryptpad_color_red_fader; +@cp_admin-last-fg: @cryptpad_text_col; +@cp_admin-last-bg: @cryptpad_color_grey_300; // Code @cp_preview-bg: @cryptpad_color_white; @@ -343,7 +331,7 @@ // Debug @cp_debug-hover: fade(@cryptpad_color_black, 10%); -@cp_debug-icon-hover: @cryptpad_color_dark_grey; +@cp_debug-icon-hover: @cryptpad_color_grey_300; // Mediatag @cp_mediatag-text-bg: @cryptpad_color_white; @@ -397,14 +385,14 @@ // 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-uncommitted-bg: @cryptpad_color_grey_200; +@cp_poll-border-color: @cryptpad_color_grey_600; @cp_poll-cell-fg: @cryptpad_text_col; -@cp_poll-unset: @cryptpad_color_help_grey; +@cp_poll-unset: @cryptpad_color_grey_300; @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; +@cp_poll-hint: @cryptpad_color_grey_500; // Profile @cp_profile-border: @cryptpad_color_grey_400; @@ -423,6 +411,6 @@ // Whiteboard @cp_whiteboard-board-bg: @cryptpad_color_white; -@cp_whiteboard-board-border: @cryptpad_color_hint_grey; +@cp_whiteboard-board-border: @cryptpad_color_grey_600; @cp_whiteboard-bg: @cp_app-bg; @cp_whiteboard-fg: @cryptpad_text_col; diff --git a/customize.dist/src/less2/include/drive.less b/customize.dist/src/less2/include/drive.less index 30d369ff5..c0f0d3a7c 100644 --- a/customize.dist/src/less2/include/drive.less +++ b/customize.dist/src/less2/include/drive.less @@ -456,6 +456,10 @@ background: @cp_drive-infobox-bg; color: @cp_drive-infobox-fg; cursor: default; + a { + color: @cryptpad_color_link; + text-decoration: underline; + } span { cursor: pointer; float: right; diff --git a/customize.dist/src/less2/include/dropdown.less b/customize.dist/src/less2/include/dropdown.less index f67a51dc6..ddba87cd7 100644 --- a/customize.dist/src/less2/include/dropdown.less +++ b/customize.dist/src/less2/include/dropdown.less @@ -7,12 +7,12 @@ --LessLoader_require: LessLoader_currentFile(); } & { - .ui-autocomplete { + ul.ui-autocomplete { background-color: @cp_autocomplete-bg; color: @cp_autocomplete-fg; } - ul.ui-menu { - border: 1px solid @cp_autocomplete-border; // FIXME doesn't work + ul.ui-menu.ui-widget { + border: 1px solid @cp_autocomplete-border; .ui-state-active { background-color: @cp_autocomplete-hover; color: @cp_autocomplete-fg; diff --git a/customize.dist/src/less2/include/sidebar-layout.less b/customize.dist/src/less2/include/sidebar-layout.less index 275bf769b..ef93eae4a 100644 --- a/customize.dist/src/less2/include/sidebar-layout.less +++ b/customize.dist/src/less2/include/sidebar-layout.less @@ -110,7 +110,7 @@ input { flex: 1; //border-radius: 0.25em 0 0 0.25em; - border: 1px solid @cryptpad_color_neutral_grey; + border: 1px solid @cryptpad_color_grey_500; border-right: 0px; } button { diff --git a/customize.dist/src/less2/include/tokenfield.less b/customize.dist/src/less2/include/tokenfield.less index a8a9805ce..e71d43c96 100644 --- a/customize.dist/src/less2/include/tokenfield.less +++ b/customize.dist/src/less2/include/tokenfield.less @@ -5,7 +5,7 @@ --LessLoader_require: LessLoader_currentFile(); } & { - .ui-autocomplete { + ul.ui-autocomplete { z-index: 100001; // alertify + 1 } .tokenfield { diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less index 7b4e43d0d..3f19aa433 100644 --- a/customize.dist/src/less2/include/toolbar.less +++ b/customize.dist/src/less2/include/toolbar.less @@ -399,6 +399,9 @@ button { .toolbar_button; + &.cp-notifications-bell { + color: @cryptpad_text_col; + } } .cp-toolbar-limit { diff --git a/www/admin/app-admin.less b/www/admin/app-admin.less index da4703203..6d8b5c2b0 100644 --- a/www/admin/app-admin.less +++ b/www/admin/app-admin.less @@ -104,7 +104,6 @@ color: fade(@cryptpad_text_col, 80%); .cp-support-ispremium { padding: 0 5px; - color: @cp_admin-premium-fg; background-color: @cp_admin-premium-bg; } } @@ -118,19 +117,19 @@ } } .cp-support-list-message { + .cp-support-showdata { + background-color: lighten(@cp_admin-last-bg, 5%); + } &:last-child:not(.cp-support-fromadmin) { color: @cp_admin-last-fg; background-color: @cp_admin-last-bg; - .cp-support-showdata { - background-color: lighten(@cp_admin-last-bg, 5%); - } } &:last-child { &.cp-support-frompremium { background-color: @cp_admin-premium-bg; .cp-support-showdata { - background-color: lighten(@cp_admin-premium-bg, 30%); + background-color: fade(@cp_admin-premium-bg, 10%); } } } @@ -160,10 +159,10 @@ } .cp-support-fromadmin { - color: @cp_admin-isadmin-fg; - background-color: @cp_admin-isadmin-bg; - .cp-support-message-content { - color: @cp_admin-isadmin-fg; + background-color: @cp_admin-isadmin-bg !important; + .cp-support-message-from, .cp-support-showdata { + color: @cryptpad_text_col; + background-color: fade(@cp_admin-isadmin-bg, 10%) !important; } } diff --git a/www/common/toolbar.js b/www/common/toolbar.js index 689843f50..7541cc1c6 100644 --- a/www/common/toolbar.js +++ b/www/common/toolbar.js @@ -1049,7 +1049,7 @@ MessengerUI, Messages) { var $newPadBlock = UIElements.createDropdown(dropdownConfig); var $button = $newPadBlock.find('button'); $button.attr('title', Messages.notificationsPage); - $button.addClass('fa fa-bell-o'); + $button.addClass('fa fa-bell-o cp-notifications-bell'); var $n = $button.find('.cp-dropdown-button-title').hide(); var $empty = $(div).find('.cp-notifications-empty'); diff --git a/www/secureiframe/app-secure.less b/www/secureiframe/app-secure.less index 7a6d85db7..e1b9a1a16 100644 --- a/www/secureiframe/app-secure.less +++ b/www/secureiframe/app-secure.less @@ -56,7 +56,6 @@ line-height: 1em; cursor: pointer; - background: @cp_drive-bg; color: @cp_drive-fg; border: 1px solid @cp_drive-icon-border;