mirror of https://github.com/xwiki-labs/cryptpad
Cleanup
This commit is contained in:
parent
2554dacc4b
commit
45dff2f5c4
|
@ -10,20 +10,8 @@
|
|||
};
|
||||
& {
|
||||
@max-z-index: 2147483647;
|
||||
@alertify-fore: @colortheme_modal-fg;
|
||||
@alertify-base: @colortheme_modal-bg;
|
||||
|
||||
@alertify-dialog-bg: @alertify-base;
|
||||
@alertify-dialog-fg: @alertify-fore;
|
||||
|
||||
@alertify-btn-fg: @alertify-fore;
|
||||
|
||||
@alertify-light-bg: fade(@alertify-fore, 25%);
|
||||
@alertify-bg: @colortheme_modal-dim;
|
||||
@alertify-fg: @alertify-fore;
|
||||
|
||||
@alertify-input-bg: @colortheme_modal-input;
|
||||
@alertify-input-fg: @colortheme_modal-input-fg;
|
||||
@alertify-light-bg: fade(@cp_alertify-fg, 25%);
|
||||
|
||||
@alertify_padding-base: @variables_padding;
|
||||
@alertify_box-shadow: @variables_shadow;
|
||||
|
@ -39,7 +27,7 @@
|
|||
}
|
||||
> * {
|
||||
padding: @alertify_padding-base @alertify_padding-base * 4;
|
||||
color: @colortheme_notification-color;
|
||||
color: @cp_alertify-log-fg;
|
||||
|
||||
font-family: @colortheme_font;
|
||||
font-size: large;
|
||||
|
@ -47,22 +35,22 @@
|
|||
box-shadow: @alertify_box-shadow;
|
||||
&, &.default {
|
||||
// FIXME
|
||||
background: @colortheme_notification-log;
|
||||
background: @cp_alertify-log-bg;
|
||||
}
|
||||
&.error {
|
||||
font-weight: bold;
|
||||
background: @colortheme_notification-warn;
|
||||
background: @cp_alertify-warn-bg;
|
||||
}
|
||||
&.success {
|
||||
background: @colortheme_notification-log;
|
||||
background: @cp_alertify-log-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.alertify {
|
||||
position: fixed;
|
||||
background-color: @alertify-bg;
|
||||
color: @alertify-fg;
|
||||
background-color: @cp_alertify-overlay;
|
||||
color: @cp_alertify-fg;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
@ -86,7 +74,7 @@
|
|||
|
||||
.message {
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: @alertify-fg;
|
||||
color: @cp_alertify-fg;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -118,17 +106,17 @@
|
|||
}
|
||||
|
||||
color: @colortheme_light-base;
|
||||
background-color: @alertify-dialog-bg;
|
||||
background-color: @cp_alertify-bg;
|
||||
|
||||
input[id$="tokenfield"][type="text"].token-input {
|
||||
background-color: @alertify-dialog-bg !important;
|
||||
background-color: @cp_alertify-bg !important;
|
||||
}
|
||||
}*/
|
||||
}
|
||||
|
||||
.dialog {
|
||||
& > div {
|
||||
background-color: @alertify-dialog-bg;
|
||||
background-color: @cp_alertify-bg;
|
||||
&.half {
|
||||
width: 50%;
|
||||
max-width: 50%;
|
||||
|
@ -154,7 +142,7 @@
|
|||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
background: #fff;
|
||||
background: @cp_alertify-bg;
|
||||
box-shadow: @alertify_box-shadow;
|
||||
&.wide {
|
||||
max-width: 850px;
|
||||
|
@ -198,7 +186,7 @@
|
|||
.alertify-tabs-titles {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
border-bottom: 1px solid @alertify-fore;
|
||||
border-bottom: 1px solid @cp_alertify-fg;
|
||||
margin-bottom: 10px;
|
||||
box-sizing: content-box;
|
||||
.alertify-tabs-title {
|
||||
|
@ -208,11 +196,9 @@
|
|||
line-height: 40px;
|
||||
box-sizing: border-box;
|
||||
padding: 0 15px;
|
||||
border-left: 1px solid lighten(@alertify-base, 10%);
|
||||
border-right: 1px solid lighten(@alertify-base, 10%);
|
||||
cursor: pointer;
|
||||
&:not(.disabled):hover {
|
||||
background-color: @alertify-light-bg;
|
||||
background-color: @cp_alertify-hover;
|
||||
}
|
||||
&.disabled {
|
||||
color: @colortheme_alertify-cancel-border;
|
||||
|
@ -227,10 +213,8 @@
|
|||
}
|
||||
}
|
||||
span.alertify-tabs-active {
|
||||
background-color: @alertify-fore !important;
|
||||
border-left: 1px solid @alertify-fore;
|
||||
border-right: 1px solid @alertify-fore;
|
||||
color: @alertify-base;
|
||||
background-color: @cp_alertify-fg !important;
|
||||
color: @cp_alertify-bg;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
@ -251,7 +235,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
.tools_placeholder-color(@cryptpad_color_grey);
|
||||
input {
|
||||
.tools_placeholder-color();
|
||||
}
|
||||
|
||||
span.cp-password-container {
|
||||
display: flex;
|
||||
|
@ -267,7 +253,7 @@
|
|||
}
|
||||
|
||||
.fa-question-circle { // help links to Docs
|
||||
color: @colortheme_logo-2;
|
||||
color: @cp_alertify-fg;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
@ -498,11 +484,11 @@
|
|||
margin-top: @alertify_padding-base;
|
||||
}
|
||||
&.alert-primary {
|
||||
background-color: @alertify-base;
|
||||
color: @alertify-fg;
|
||||
border-color: @alertify-fg;
|
||||
background-color: @cp_alertify-bg;
|
||||
color: @cp_alertify-fg;
|
||||
border-color: @cp_alertify-fg;
|
||||
a {
|
||||
color: @alertify-fg;
|
||||
color: @cp_alertify-fg;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,8 +5,6 @@
|
|||
) {
|
||||
@avatar-width: @width;
|
||||
@avatar-font-size: @width / 1.2;
|
||||
@avatar-default-bg: #D9D8D8;
|
||||
@avatar-default-fg: darken(@avatar-default-bg, 40%);
|
||||
}
|
||||
.avatar_main(@width: 30px) {
|
||||
--LessLoader_require: LessLoader_currentFile();
|
||||
|
@ -38,8 +36,8 @@
|
|||
}
|
||||
.cp-avatar-default {
|
||||
.tools_unselectable();
|
||||
background: @avatar-default-bg;
|
||||
color: @avatar-default-fg;
|
||||
background: @cp_avatar-bg;
|
||||
color: @cp_avatar-fg;
|
||||
font-size: @avatar-font-size;
|
||||
font-size: var(--avatar-font-size);
|
||||
text-transform: capitalize;
|
||||
|
|
|
@ -22,6 +22,15 @@
|
|||
--checkmark-radio-size: @checkmark-radio-size;
|
||||
}
|
||||
& {
|
||||
// XXX DARK
|
||||
@cp_checkmark-back0: @colortheme_form-bg-alt;
|
||||
@cp_checkmark-back0-active: @colortheme_form-border;
|
||||
@cp_checkmark-back1: @colortheme_form-bg;
|
||||
@cp_checkmark-col1: @colortheme_form-color;
|
||||
@cp_checkmark-back2: @colortheme_form-bg-alt;
|
||||
@cp_checkmark-col2: @colortheme_form-color-alt;
|
||||
@cp_checkmark-disabled: @cp_forms-disabled;
|
||||
|
||||
.checkmark_vars();
|
||||
// <label.cp-checkmark><input><span.cp-checkmark-mark></span>Text</label>
|
||||
.cp-checkmark {
|
||||
|
@ -41,40 +50,40 @@
|
|||
&.cp-checkmark-secondary {
|
||||
.cp-checkmark-mark {
|
||||
&:after {
|
||||
border-color: @colortheme_checkmark-col2;
|
||||
border-color: @cp_checkmark-col2;
|
||||
}
|
||||
}
|
||||
input {
|
||||
&:checked ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-back2;
|
||||
border-color: @colortheme_checkmark-back2;
|
||||
background-color: @cp_checkmark-back2;
|
||||
border-color: @cp_checkmark-back2;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-disabled;
|
||||
background-color: @cp_checkmark-disabled;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-label {
|
||||
color: @colortheme_checkmark-disabled;
|
||||
color: @cp_checkmark-disabled;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-back0-active;
|
||||
background-color: @cp_checkmark-back0-active;
|
||||
}
|
||||
|
||||
input {
|
||||
display: none;
|
||||
&:checked ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-back1;
|
||||
border-color: @colortheme_checkmark-back1;
|
||||
background-color: @cp_checkmark-back1;
|
||||
border-color: @cp_checkmark-back1;
|
||||
&:after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-disabled;
|
||||
background-color: @cp_checkmark-disabled;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-label {
|
||||
color: @colortheme_checkmark-disabled;
|
||||
color: @cp_checkmark-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -91,7 +100,7 @@
|
|||
height: var(--checkmark-size);
|
||||
width: @checkmark-size;
|
||||
width: var(--checkmark-size);
|
||||
background-color: @colortheme_checkmark-back0;
|
||||
background-color: @cp_checkmark-back0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 1px solid @colortheme_form-border;
|
||||
|
@ -106,14 +115,13 @@
|
|||
height: @checkmark-dim2;
|
||||
height: var(--checkmark-dim2);
|
||||
transform: rotate(45deg);
|
||||
border: solid @colortheme_checkmark-col1;
|
||||
border: solid @cp_checkmark-col1;
|
||||
border-width: 0 @checkmark-width @checkmark-width 0;
|
||||
border-width: 0 var(--checkmark-width) var(--checkmark-width) 0;
|
||||
position: absolute;
|
||||
}
|
||||
&:focus {
|
||||
//border-color: #FF007C !important;
|
||||
box-shadow: 0px 0px 5px @colortheme_checkmark-back1;
|
||||
box-shadow: 0px 0px 5px @cp_checkmark-back1;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
@ -133,39 +141,39 @@
|
|||
&.cp-radio-secondary {
|
||||
.cp-radio-mark {
|
||||
&:after {
|
||||
border-color: @colortheme_checkmark-col2;
|
||||
border-color: @cp_checkmark-col2;
|
||||
}
|
||||
}
|
||||
input {
|
||||
&:checked ~ .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back2;
|
||||
background-color: @cp_checkmark-back2;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-disabled;
|
||||
background-color: @cp_checkmark-disabled;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-label {
|
||||
color: @colortheme_checkmark-disabled;
|
||||
color: @cp_checkmark-disabled;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back0-active;
|
||||
background-color: @cp_checkmark-back0-active;
|
||||
}
|
||||
|
||||
input {
|
||||
display: none;
|
||||
&:checked ~ .cp-radio-mark {
|
||||
background-color: @colortheme_checkmark-back1;
|
||||
border-color: @colortheme_checkmark-back1;
|
||||
background-color: @cp_checkmark-back1;
|
||||
border-color: @cp_checkmark-back1;
|
||||
&:after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-mark {
|
||||
background-color: @colortheme_checkmark-disabled;
|
||||
background-color: @cp_checkmark-disabled;
|
||||
}
|
||||
&:disabled ~ .cp-checkmark-label {
|
||||
color: @colortheme_checkmark-disabled;
|
||||
color: @cp_checkmark-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -183,7 +191,7 @@
|
|||
height: var(--checkmark-radio-size);
|
||||
width: @checkmark-radio-size;
|
||||
width: var(--checkmark-radio-size);
|
||||
background-color: @colortheme_checkmark-back0;
|
||||
background-color: @cp_checkmark-back0;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
@ -194,19 +202,14 @@
|
|||
display: none;
|
||||
content: "";
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
background: @cp_checkmark-back0;
|
||||
width: @checkmark-dim1;
|
||||
width: var(--checkmark-dim1);
|
||||
height: @checkmark-dim1;
|
||||
height: var(--checkmark-dim1);
|
||||
|
||||
//transform: rotate(45deg);
|
||||
//border: solid @colortheme_checkmark-col1;
|
||||
//border-width: 0 var(--checkmark-width) var(--checkmark-width) 0;
|
||||
}
|
||||
&:focus {
|
||||
//border-color: #FF007C !important;
|
||||
box-shadow: 0px 0px 5px @colortheme_checkmark-back1;
|
||||
box-shadow: 0px 0px 5px @cp_checkmark-back1;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -9,18 +9,17 @@
|
|||
@colortheme_loading_bg: #E7E7E7;
|
||||
|
||||
@colortheme_link-color: #0275D8;
|
||||
@colortheme_link-color-visited: #005999;
|
||||
@colortheme_link-color-visited: lighten(@colortheme_link-color, 10%);
|
||||
@colortheme_info-background: #eeeeee;
|
||||
|
||||
@colortheme_old-base: #302B28;
|
||||
@colortheme_old-fore: #fafafa;
|
||||
|
||||
@colortheme_base: #fff;
|
||||
@colortheme_light-base: lighten(@colortheme_base, 20%);
|
||||
|
||||
@colortheme_cp-red: #FA5858; // remove red
|
||||
@colortheme_cp-green: #46E981;
|
||||
|
||||
@colortheme_old-fore: #fafafa;
|
||||
|
||||
@colortheme_form-border: #bbbbbb;
|
||||
@colortheme_form-bg: @colortheme_logo-2;
|
||||
@colortheme_form-color: #ffffff;
|
||||
|
@ -48,9 +47,6 @@
|
|||
@colortheme_alertify-red: #E55236;
|
||||
@colortheme_alertify-red-color: #FFF;
|
||||
@colortheme_alertify-red-border: transparent;
|
||||
@colortheme_alertify-green: #77C825;
|
||||
@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;
|
||||
|
@ -60,15 +56,8 @@
|
|||
@colortheme_alertify-cancel: @colortheme_modal-bg;
|
||||
@colortheme_alertify-cancel-border: #949494;
|
||||
|
||||
@colortheme_notification-log: fade(@colortheme_logo-2, 90%);
|
||||
@colortheme_notification-color: #fff;;
|
||||
@colortheme_notification-warn: rgba(205, 37, 50, 0.8);
|
||||
|
||||
@colortheme_dropdown-bg: #f9f9f9;
|
||||
@colortheme_dropdown-color: black;
|
||||
@colortheme_dropdown-bg-hover: #f1f1f1;
|
||||
@colortheme_dropdown-bg-active: #e8e8e8;
|
||||
|
||||
// Apps, these colors are used for customizing the toolbar for the apps.
|
||||
@colortheme_toolbar-warn: @colortheme_alertify-red;
|
||||
@colortheme_pad-toolbar-bg: #eeeeee;
|
||||
|
@ -115,11 +104,8 @@
|
|||
@colortheme_sidebar-button-alt-bg: #fff;
|
||||
|
||||
@cryptpad_color_blue: #4591C4;
|
||||
@cryptpad_color_grey: #999999;
|
||||
@cryptpad_color_light_grey: #e0e0e0;
|
||||
@cryptpad_header_col: #1E1F1F;
|
||||
@cryptpad_text_col: #3F4141;
|
||||
@cryptpad_color_light_blue: #00b7d8;
|
||||
|
||||
@colortheme_checkmark-back0: @colortheme_form-bg-alt;
|
||||
@colortheme_checkmark-back0-active: @colortheme_form-border;
|
||||
|
@ -128,3 +114,69 @@
|
|||
@colortheme_checkmark-back2: @colortheme_form-bg-alt;
|
||||
@colortheme_checkmark-col2: @colortheme_form-color-alt;
|
||||
@colortheme_checkmark-disabled: #AAA;
|
||||
|
||||
// New variables
|
||||
|
||||
// Colors
|
||||
@cryptpad_color_dark_grey: #999999;
|
||||
@cryptpad_color_grey: #e0e0e0;
|
||||
@cryptpad_color_light_grey: #f1f1f1;
|
||||
@cryptpad_color_lighter_grey: #f9f9f9;
|
||||
@cryptpad_color_light_blue: #00b7d8;
|
||||
@cryptpad_color_black: #000;
|
||||
@cryptpad_color_white: #FFF;
|
||||
|
||||
// Alertify
|
||||
@cp_alertify-bg: @cryptpad_color_white;
|
||||
@cp_alertify-fg: @colortheme_logo-2;
|
||||
@cp_alertify-hover: fade(@cp_alertify-fg, 25%);
|
||||
@cp_alertify-overlay: fade(@cryptpad_text_col, 50%);
|
||||
@cp_alertify-log-bg: fade(@colortheme_logo-2, 90%);
|
||||
@cp_alertify-log-fg: @cryptpad_color_white;
|
||||
@cp_alertify-warn-bg: rgba(205, 37, 50);
|
||||
|
||||
// Forms
|
||||
@cp_forms-fg: @cryptpad_text_col;
|
||||
@cp_forms-border: @colortheme_logo-2;
|
||||
@cp_forms-placeholder: @cryptpad_color_dark_grey;
|
||||
@cp_forms-readonly: fade(@colortheme_logo-2, 25%);
|
||||
@cp_forms-disabled: #AAA;
|
||||
|
||||
// Buttons
|
||||
@cp_buttons-fg: @colortheme_logo-2;
|
||||
@cp_buttons-default: #CCC;
|
||||
@cp_buttons-default-color: @cryptpad_text_col;
|
||||
@cp_buttons-default-border: @cryptpad_text_col;
|
||||
@cp_buttons-red: #E55236;
|
||||
@cp_buttons-red-color: #FFF;
|
||||
@cp_buttons-red-border: transparent;
|
||||
@cp_buttons-primary: @colortheme_form-bg;
|
||||
@cp_buttons-primary-text: @colortheme_form-color;
|
||||
@cp_buttons-primary-border: transparent;
|
||||
@cp_buttons-disabled: #6c757d;
|
||||
@cp_buttons-disabled-text: #ffffff;
|
||||
@cp_buttons-disabled-border: #6c757d;
|
||||
@cp_buttons-cancel: @colortheme_modal-bg;
|
||||
@cp_buttons-cancel-border: #949494;
|
||||
|
||||
|
||||
// Tooltip background
|
||||
@cp_tooltip-bg: @cryptpad_color_grey;
|
||||
@cp_tooltip-fg: @cryptpad_text_col;
|
||||
|
||||
// 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;
|
||||
|
||||
// Rendered Markdown
|
||||
@cp_markdown-bg: @cryptpad_color_light_grey;
|
||||
@cp_markdown-border: @cryptpad_color_grey;
|
||||
|
||||
// Avatar
|
||||
@cp_avatar-bg: @cryptpad_color_grey;
|
||||
@cp_avatar-fg: @cryptpad_text_col;
|
||||
|
||||
// Other
|
||||
@cp_shadow-color: rgba(0,0,0,0.4);
|
||||
|
|
|
@ -232,7 +232,7 @@
|
|||
input {
|
||||
background: transparent;
|
||||
color: @colortheme_drive-color;
|
||||
.tools_placeholder-color(@cryptpad_color_grey);
|
||||
.tools_placeholder-color();
|
||||
outline-width: 0px;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
|
|
|
@ -46,7 +46,7 @@
|
|||
.cp-dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: @colortheme_dropdown-bg;
|
||||
background-color: @cp_dropdown-bg;
|
||||
min-width: 250px;
|
||||
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1000; //Z dropdown content
|
||||
|
@ -64,7 +64,7 @@
|
|||
}
|
||||
|
||||
& > a, & > span {
|
||||
color: @colortheme_dropdown-color;
|
||||
color: @cp_dropdown-fg;
|
||||
padding: 5px 16px;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
|
@ -100,13 +100,13 @@
|
|||
}
|
||||
|
||||
&:hover {
|
||||
background-color: @colortheme_dropdown-bg-hover;
|
||||
color: @colortheme_dropdown-color;
|
||||
background-color: @cp_dropdown-bg-hover;
|
||||
color: @cp_dropdown-fg;
|
||||
}
|
||||
|
||||
&.cp-dropdown-element-active {
|
||||
background-color: @colortheme_dropdown-bg-active;
|
||||
color: @colortheme_dropdown-color;
|
||||
background-color: @cp_dropdown-bg-active;
|
||||
color: @cp_dropdown-fg;
|
||||
}
|
||||
}
|
||||
&> span {
|
||||
|
@ -138,7 +138,7 @@
|
|||
hr {
|
||||
margin: 5px 0px;
|
||||
height: 1px;
|
||||
background: #bbb;
|
||||
background: @cp_dropdown-bg-active;
|
||||
& + hr {
|
||||
display: none;
|
||||
}
|
||||
|
@ -150,21 +150,11 @@
|
|||
margin: 0;
|
||||
white-space: normal;
|
||||
text-align: left;
|
||||
color: black;
|
||||
color: @cp_dropdown-fg;
|
||||
font-size: 14px;
|
||||
* {
|
||||
font-size: 14px;
|
||||
}
|
||||
h2 {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
background-color: #EEEEEE;
|
||||
padding: 5px 0px;
|
||||
margin: 5px 0px;
|
||||
font-size: 16px;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,24 +6,18 @@
|
|||
}
|
||||
|
||||
& {
|
||||
@alertify-fore: @colortheme_modal-fg;
|
||||
@alertify-btn-fg: @alertify-fore;
|
||||
@alertify-light-bg: fade(@alertify-fore, 25%);
|
||||
@alertify_padding-base: @variables_padding;
|
||||
@alertify-input-bg: @colortheme_modal-input;
|
||||
@alertify-input-fg: @colortheme_modal-input-fg;
|
||||
|
||||
input:not(.form-control):not([type="checkbox"]), textarea, div.cp-textarea {
|
||||
// background-color: @alertify-input-fg;
|
||||
color: @cryptpad_text_col;
|
||||
border: 1px solid @alertify-input-bg;
|
||||
color: @cp_forms-fg;
|
||||
border: 1px solid @cp_forms-border;
|
||||
width: 100%;
|
||||
font-size: 100%;
|
||||
padding: @alertify_padding-base;
|
||||
&[readonly] {
|
||||
background-color: @alertify-light-bg;
|
||||
color: @cryptpad_text_col;
|
||||
border-color: @alertify-input-fg;
|
||||
background-color: @cp_forms-readonly;
|
||||
color: @cp_forms-fg;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -76,9 +70,9 @@
|
|||
height: 3px;
|
||||
& > div {
|
||||
height: 100%;
|
||||
background-color: @colortheme_alertify-primary;
|
||||
background-color: @cp_buttons-primary;
|
||||
&.danger, &.btn-danger, &.danger-alt, &.btn-danger-alt {
|
||||
background-color: @colortheme_alertify-red;
|
||||
background-color: @cp_buttons-red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -89,7 +83,7 @@
|
|||
|
||||
button.btn {
|
||||
|
||||
background-color: @colortheme_alertify-cancel;
|
||||
background-color: @cp_buttons-cancel;
|
||||
box-sizing: border-box;
|
||||
outline: 0;
|
||||
align-items: center;
|
||||
|
@ -111,80 +105,63 @@
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
color: @alertify-btn-fg;
|
||||
border: 1px solid @alertify-btn-fg;
|
||||
color: @cp_buttons-fg;
|
||||
border: 1px solid @cp_buttons-fg;
|
||||
|
||||
&.no-margin {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&:hover, &:not(:disabled):not(.disabled):active, &:focus {
|
||||
color: @alertify-btn-fg;
|
||||
border: 1px solid @alertify-btn-fg;
|
||||
background-color: lighten(@alertify-fore, 35%);
|
||||
}
|
||||
|
||||
&.safe, &.danger, &.btn-safe, &.btn-danger {
|
||||
color: @colortheme_old-base;
|
||||
white-space: normal;
|
||||
font-weight: bold;
|
||||
color: @cp_buttons-fg;
|
||||
border: 1px solid @cp_buttons-fg;
|
||||
background-color: lighten(@cp_buttons-fg, 35%);
|
||||
}
|
||||
|
||||
&.btn-default {
|
||||
border-color: @cryptpad_text_col;
|
||||
color: @cryptpad_text_col;
|
||||
border-color: @cp_buttons-default-border;
|
||||
color: @cp_buttons-default-color;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
border-color: @cryptpad_text_col;
|
||||
color: @cryptpad_text_col;
|
||||
background-color: #ccc;
|
||||
border-color: @cp_buttons-default-border;
|
||||
color: @cp_buttons-default-color;
|
||||
background-color: @cp_buttons-default;
|
||||
}
|
||||
}
|
||||
|
||||
&.danger, &.btn-danger {
|
||||
background-color: @colortheme_alertify-red;
|
||||
border-color: @colortheme_alertify-red-border;
|
||||
color: @colortheme_alertify-red-color;
|
||||
background-color: @cp_buttons-red;
|
||||
border-color: @cp_buttons-red-border;
|
||||
color: @cp_buttons-red-color;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
border-color: @colortheme_alertify-red-border;
|
||||
color: @colortheme_alertify-red-color;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-red, 10%), lighten(@colortheme_alertify-red, 10%));
|
||||
border-color: @cp_buttons-red-border;
|
||||
color: @cp_buttons-red-color;
|
||||
background-color: contrast(@cp_buttons-red-color, darken(@cp_buttons-red, 10%), lighten(@colortheme_alertify-red, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&.danger-alt, &.btn-danger-alt, &.btn-danger-outline {
|
||||
border-color: @colortheme_alertify-red;
|
||||
color: @colortheme_alertify-red;
|
||||
border-color: @cp_buttons-red;
|
||||
color: @cp_buttons-red;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
border-color: @colortheme_alertify-red;
|
||||
color: @colortheme_alertify-red-color;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-red, 10%), lighten(@colortheme_alertify-red, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&.safe, &.btn-safe {
|
||||
background-color: @colortheme_alertify-green;
|
||||
border-color: @colortheme_alertify-green-border;
|
||||
color: @colortheme_alertify-green-color;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
border-color: @colortheme_alertify-green-border;
|
||||
color: @colortheme_alertify-green-color;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-green, 10%), lighten(@colortheme_alertify-green, 10%));
|
||||
border-color: @cp_buttons-red;
|
||||
color: @cp_buttons-red-color;
|
||||
background-color: @cp_buttons-red;
|
||||
}
|
||||
}
|
||||
|
||||
&.primary, &.btn-primary, &.btn-success {
|
||||
background-color: @colortheme_alertify-primary;
|
||||
color: @colortheme_alertify-primary-text;
|
||||
border-color: @colortheme_alertify-primary-border;
|
||||
background-color: @cp_buttons-primary;
|
||||
color: @cp_buttons-primary-text;
|
||||
border-color: @cp_buttons-primary-border;
|
||||
font-weight: bold;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
color: @colortheme_alertify-primary-text;
|
||||
border-color: @colortheme_alertify-primary-border;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@colortheme_alertify-primary, 10%), lighten(@colortheme_alertify-primary, 10%));
|
||||
color: @cp_buttons-primary-text;
|
||||
border-color: @cp_buttons-primary-border;
|
||||
background-color: contrast(@colortheme_modal-bg, darken(@cp_buttons-primary, 10%), lighten(@colortheme_alertify-primary, 10%));
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-light {
|
||||
&.btn-light { // XXX DARK
|
||||
border-color: @cryptpad_text_col;
|
||||
color: @cryptpad_text_col;
|
||||
background-color: transparent;
|
||||
|
@ -196,12 +173,12 @@
|
|||
}
|
||||
|
||||
&.cancel, &.btn-cancel {
|
||||
border-color: @colortheme_alertify-cancel-border;
|
||||
color: @colortheme_alertify-cancel-border;
|
||||
border-color: @cp_buttons-cancel-border;
|
||||
color: @cp_buttons-cancel-border;
|
||||
&:hover, &:not(:disabled):active, &:focus {
|
||||
border-color: @colortheme_alertify-cancel-border;
|
||||
color: @colortheme_alertify-cancel-border;
|
||||
background-color: fade(@colortheme_alertify-cancel-border, 25%);
|
||||
border-color: @cp_buttons-cancel-border;
|
||||
color: @cp_buttons-cancel-border;
|
||||
background-color: fade(@cp_buttons-cancel-border, 25%);
|
||||
}
|
||||
}
|
||||
&.btn-register {
|
||||
|
@ -212,7 +189,7 @@
|
|||
|
||||
&:focus {
|
||||
//border: 1px dotted @alertify-base;
|
||||
box-shadow: 0px 0px 5px @colortheme_alertify-primary !important;
|
||||
box-shadow: 0px 0px 5px @cp_buttons-primary !important;
|
||||
outline: none;
|
||||
}
|
||||
&::-moz-focus-inner {
|
||||
|
@ -221,11 +198,11 @@
|
|||
|
||||
&:disabled {
|
||||
cursor: not-allowed !important;
|
||||
background-color: @colortheme_alertify-disabled;
|
||||
color: @colortheme_alertify-disabled-text;
|
||||
border-color: @colortheme_alertify-disabled-border;
|
||||
background-color: @cp_buttons-disabled;
|
||||
color: @cp_buttons-disabled-text;
|
||||
border-color: @cp_buttons-disabled-border;
|
||||
&:hover, &:active {
|
||||
background-color: @colortheme_alertify-disabled;
|
||||
background-color: @cp_buttons-disabled;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,16 +1,13 @@
|
|||
@import (reference) "./tools.less";
|
||||
|
||||
.markdown_main() {
|
||||
@nice-grey: #f3f3f3;
|
||||
@accent-grey: rgba(0, 0, 0, 0.2);
|
||||
hr {
|
||||
border-top: 1px solid @accent-grey;
|
||||
border-top: 1px solid @cp_markdown-border;
|
||||
}
|
||||
blockquote {
|
||||
background: @nice-grey;
|
||||
background: rgba(144, 144, 144, 0.2);
|
||||
background: @cp_markdown-bg;
|
||||
padding: 10px;
|
||||
border-left: 2px solid @accent-grey;
|
||||
border-left: 2px solid @cp_markdown-border;
|
||||
padding-right: 0;
|
||||
p { margin: 0; }
|
||||
blockquote { margin: 0; }
|
||||
|
@ -21,7 +18,7 @@
|
|||
// todo ul, ol
|
||||
// TOC
|
||||
div.cp-md-toc {
|
||||
background: @nice-grey;
|
||||
background: @cp_markdown-bg;
|
||||
padding: 20px;
|
||||
* {
|
||||
margin: 5px;
|
||||
|
@ -57,7 +54,7 @@
|
|||
}
|
||||
|
||||
div.plain-text-reader {
|
||||
background: #f3f3f3;
|
||||
background: @cp_markdown-bg;
|
||||
padding: 10px;
|
||||
color: black;
|
||||
text-align: left;
|
||||
|
@ -111,7 +108,7 @@
|
|||
width: 100px;
|
||||
height: 100px;
|
||||
display: inline-block;
|
||||
border: 1px solid #BBB;
|
||||
border: 1px solid @cp_markdown-border;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -121,7 +118,7 @@
|
|||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: bold;
|
||||
padding-bottom: 0.3em;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-bottom: 1px solid @cp_markdown-border;
|
||||
}
|
||||
li {
|
||||
min-height: 22px;
|
||||
|
@ -139,7 +136,7 @@
|
|||
.mediatag_cryptpad();
|
||||
|
||||
pre.markmap {
|
||||
border: 1px solid #ddd;
|
||||
border: 1px solid @cp_markdown-border;
|
||||
svg {
|
||||
height: 400px;
|
||||
}
|
||||
|
@ -153,11 +150,11 @@
|
|||
}
|
||||
}
|
||||
|
||||
.markdown_preformatted-code (@color: #333) {
|
||||
.markdown_preformatted-code () {
|
||||
pre > code {
|
||||
display: block;
|
||||
position: relative;
|
||||
border: 1px solid @color;
|
||||
border: 1px solid @cp_markdown-border;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
padding-left: .25vw;
|
||||
|
@ -166,16 +163,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
.markdown_gfm-table (@color: black) {
|
||||
.markdown_gfm-table () {
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
tr {
|
||||
th {
|
||||
border: 1px solid @color;
|
||||
border: 1px solid @cryptpad_color_black;
|
||||
padding: 15px;
|
||||
}
|
||||
td {
|
||||
border: 1px solid @color;
|
||||
border: 1px solid @cryptpad_color_black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,15 +4,15 @@
|
|||
.modal_base() {
|
||||
font-family: @colortheme_font;
|
||||
|
||||
background-color: @colortheme_modal-bg;
|
||||
color: @colortheme_modal-fg;
|
||||
background-color: @cp_alertify-bg;
|
||||
color: @cp_alertify-fg;
|
||||
box-shadow: @variables_shadow;
|
||||
|
||||
a {
|
||||
color: @colortheme_modal-link;
|
||||
color: @colortheme_link-color;
|
||||
|
||||
&:visited {
|
||||
color: @colortheme_modal-link-visited;
|
||||
color: @colortheme_link-color-visited;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -33,11 +33,11 @@
|
|||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: @colortheme_modal-dim;
|
||||
background-color: @cp_alertify-overlay;
|
||||
|
||||
.cp-modal {
|
||||
background-color: @colortheme_modal-bg;
|
||||
color: @colortheme_modal-fg;
|
||||
background-color: @cp_alertify-bg;
|
||||
color: @cp_alertify-fg;
|
||||
box-shadow: @variables_shadow;
|
||||
|
||||
padding: @variables_padding;
|
||||
|
@ -71,16 +71,10 @@
|
|||
}
|
||||
|
||||
input {
|
||||
background-color: @colortheme_modal-input;
|
||||
color: @colortheme_modal-input-fg;
|
||||
border: 0;
|
||||
padding: 8px 12px;
|
||||
margin: 1em;
|
||||
width: 300px;
|
||||
&[type="text"] {
|
||||
background-color: @colortheme_modal-input-fg;
|
||||
color: @cryptpad_text_col;
|
||||
border: 1px solid @colortheme_modal-input;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,19 +5,16 @@
|
|||
}
|
||||
& {
|
||||
.tippy-tooltip.cryptpad-theme {
|
||||
/* Your styling here. Example: */
|
||||
background-color: @cryptpad_color_light_grey;
|
||||
background-color: @cp_tooltip-bg;
|
||||
border-radius: 0px;
|
||||
// box-shadow: 2px 2px 10px #000;
|
||||
// font-weight: bold;
|
||||
color: #333;
|
||||
color: @cp_tooltip-fg;
|
||||
overflow-wrap: break-word;
|
||||
[x-circle] {
|
||||
background-color: unset;
|
||||
}
|
||||
}
|
||||
.tippy-popper {
|
||||
@arrow-color: @cryptpad_color_light_grey;
|
||||
@arrow-color: @cp_tooltip-bg;
|
||||
&[x-placement^='top'] .tippy-arrow {
|
||||
border-top-color: @arrow-color;
|
||||
}
|
||||
|
|
|
@ -570,9 +570,6 @@
|
|||
.cp-toolbar-limit {
|
||||
color: @colortheme_toolbar-warn;
|
||||
}
|
||||
.cp-dropdown-content.cp-dropdown-left a {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
.cp-toolbar-top {
|
||||
|
@ -1076,7 +1073,7 @@
|
|||
top: @toolbar_line-height;
|
||||
margin: -1px;
|
||||
min-width: 50px;
|
||||
background: @colortheme_dropdown-bg;
|
||||
background: @cp_dropdown-bg;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
z-index: 10000; //Z cp-toolbar-drawer-content
|
||||
|
@ -1111,8 +1108,8 @@
|
|||
vertical-align: baseline;
|
||||
}
|
||||
&:hover {
|
||||
background-color: @colortheme_dropdown-bg-hover !important;
|
||||
color: @colortheme_dropdown-color;
|
||||
background-color: @cp_dropdown-bg-hover !important;
|
||||
color: @cp_dropdown-fg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
.tools_placeholder-color (@color) {
|
||||
@import (reference) "./colortheme-all.less";
|
||||
|
||||
.tools_placeholder-color () {
|
||||
@color: @cp_forms-placeholder;
|
||||
&::-webkit-input-placeholder { /* WebKit, Blink, Edge */
|
||||
color: @color;;
|
||||
color: @color;
|
||||
}
|
||||
&::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
|
||||
color: @color;
|
||||
|
|
|
@ -33,10 +33,7 @@
|
|||
margin: 0;
|
||||
margin-bottom: 0 !important;
|
||||
height: 38px;
|
||||
&::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
|
||||
color: @cryptpad_color_grey;
|
||||
opacity: 1; /* Firefox */
|
||||
}
|
||||
.tools_placeholder-color();
|
||||
}
|
||||
margin-bottom: 10px;
|
||||
&:empty {
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
@import (reference) "./colortheme-all.less";
|
||||
|
||||
// This is a file for generic constants which we didn't want to hardcode everywhere.
|
||||
// However, unlike colortheme, customizing these variables will cause breakage.
|
||||
|
||||
|
@ -7,4 +9,4 @@
|
|||
|
||||
// Used in modal.less and alertify.less
|
||||
@variables_padding: 12px;
|
||||
@variables_shadow: 0 8px 32px 0 rgba(0,0,0,.4);
|
||||
@variables_shadow: 0 8px 32px 0 @cp_shadow-color;
|
||||
|
|
|
@ -102,7 +102,7 @@
|
|||
margin: 1em auto;
|
||||
|
||||
.markdown_preformatted-code;
|
||||
.markdown_gfm-table(black);
|
||||
.markdown_gfm-table();
|
||||
table {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
@ -135,7 +135,7 @@
|
|||
position: relative;
|
||||
display: none;
|
||||
.markdown_preformatted-code;
|
||||
.markdown_gfm-table(black);
|
||||
.markdown_gfm-table();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,27 +0,0 @@
|
|||
.markdown_preformatted-code (@color: #333) {
|
||||
pre > code {
|
||||
display: block;
|
||||
position: relative;
|
||||
border: 1px solid @color;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
padding-left: .25vw;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.markdown_gfm-table (@color: black) {
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
tr {
|
||||
th {
|
||||
border: 3px solid @color;
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// todo ul, ol
|
||||
|
|
@ -183,7 +183,7 @@
|
|||
.markdown_main();
|
||||
.markdown_cryptpad();
|
||||
.markdown_preformatted-code;
|
||||
.markdown_gfm-table(black);
|
||||
.markdown_gfm-table();
|
||||
p {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
@ -197,7 +197,7 @@
|
|||
border: none;
|
||||
padding: 5px;
|
||||
margin: 0;
|
||||
background-color: @cryptpad_color_light_grey;
|
||||
background-color: @cryptpad_color_grey;
|
||||
width: 100%;
|
||||
}
|
||||
table {
|
||||
|
|
|
@ -655,7 +655,6 @@ define([
|
|||
}, {
|
||||
ok: Messages.register_writtenPassword,
|
||||
cancel: Messages.register_cancel,
|
||||
cancelClass: 'btn.btn-safe',
|
||||
okClass: 'btn.btn-danger',
|
||||
reverseOrder: true,
|
||||
done: function($dialog) {
|
||||
|
|
|
@ -369,7 +369,7 @@
|
|||
|
||||
.markdown_main();
|
||||
.markdown_preformatted-code;
|
||||
.markdown_gfm-table(#ddd);
|
||||
.markdown_gfm-table();
|
||||
|
||||
ul, ol {
|
||||
min-width: 50%;
|
||||
|
|
Loading…
Reference in New Issue