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

Dark bootstrap alerts

pull/1/head
David Benqué 2021-02-05 17:23:04 +00:00
parent 8db11fc686
commit b37f390529
6 changed files with 97 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
customize.dist/src/less2/include/alertify.less
View File

@ -471,36 +471,5 @@
overflow-x: auto;
}
}
// Bootstrap Alerts
.alert {
margin: 0px 0px @alertify_padding-base 0px;
font-size: 12px;
padding: 5px;
border-radius: 0px;
i {
margin-right: 10px;
}
&.cp-alert-top {
margin-top: @alertify_padding-base;
}
&.alert-primary {
background-color: @cp_alertify-bg;
color: @cp_alertify-fg;
border-color: @cp_alertify-fg;
a {
color: @cp_alertify-fg;
text-decoration: underline;
}
}
&.dismissable {
display: flex;
align-items: center;
span.fa-times {
font-size: @colortheme_app-font-size;
margin-left: 20px;
cursor: pointer;
}
}
}
}

21
customize.dist/src/less2/include/colortheme-dark.less
View File

@ -61,15 +61,18 @@
@cryptpad_color_light_blue: #00b7d8;
@cryptpad_color_red: #ff1100;
@cryptpad_color_red_fade: fade(@cryptpad_color_red, 50%);
@cryptpad_color_red_fader: fade(@cryptpad_color_red, 25%);
@cryptpad_color_warn_red: @cryptpad_color_red_fade;
@cryptpad_color_dark_red: #9e0000;
@cryptpad_color_light_red: #FFD4D4;
@cryptpad_color_light_red_fade: fade(@cryptpad_color_light_red, 20%);
@cryptpad_color_orange: #f49842;
@cryptpad_color_green: #5cb85c;
@cryptpad_color_green_fade: fade(@cryptpad_color_green, 50%);
@cryptpad_color_light_green: #c5ffa8;
@cryptpad_color_light_green_fade: fade(@cryptpad_color_light_green, 20%);
@cryptpad_color_light_yellow: #FFE69C;
@cryptpad_color_yellow_fade: fade(#FFE69C, 50%);
@cryptpad_color_yellow_fade: fade(#FFE69C, 15%);
@cryptpad_color_lighter_blue: #d2e1f2; // XXX replace with @cryptpad_color_brand_fadest
@cryptpad_color_link:@cryptpad_color_brand_300;
@ -118,6 +121,20 @@
@cp_forms-readonly-border: @cryptpad_color_brand;
@cp_forms-disabled: @cryptpad_color_grey_500;
// Bootstrap alerts
@cp_alerts-warning-bg: @cryptpad_color_yellow_fade;
@cp_alerts-warning-fg: @cryptpad_color_light_yellow;
@cp_alerts-warning-text: @cryptpad_color_light_yellow;
@cp_alerts-danger-bg: @cryptpad_color_red_fader;
@cp_alerts-danger-fg: @cryptpad_color_light_red;
@cp_alerts-danger-text: @cryptpad_color_light_red;
@cp_alerts-info-bg: @cryptpad_color_brand_fadest;
@cp_alerts-info-text: @cryptpad_color_brand_300;
@cp_alerts-info-fg: @cryptpad_color_brand_300;
@cp_alerts-success-bg: @cryptpad_color_light_green_fade;
@cp_alerts-success-fg: @cryptpad_color_green;
@cp_alerts-success-text: @cryptpad_color_light_green;
// Buttons
@cp_buttons-fg: @cryptpad_color_brand_300;
@cp_buttons-hover: @cryptpad_color_brand_fadest;
@ -216,7 +233,7 @@
@cp_upload-progress: @cryptpad_color_grey_700;
// Help
@cp_help-bg: @cryptpad_color_grey_700;
@cp_help-bg: @cryptpad_color_grey_800;
@cp_help-fg: @cryptpad_text_col;
@cp_help-link: @cryptpad_color_link;

19
customize.dist/src/less2/include/colortheme.less
View File

@ -61,15 +61,18 @@
@cryptpad_color_light_blue: #00b7d8;
@cryptpad_color_red: #ff1100;
@cryptpad_color_red_fade: fade(@cryptpad_color_red, 50%);
@cryptpad_color_red_fader: fade(@cryptpad_color_red, 25%);
@cryptpad_color_warn_red: @cryptpad_color_red_fade;
@cryptpad_color_dark_red: #9e0000;
@cryptpad_color_light_red: #FFD4D4;
@cryptpad_color_light_red_fade: fade(@cryptpad_color_light_red, 75%);
@cryptpad_color_orange: #f49842;
@cryptpad_color_green: #5cb85c;
@cryptpad_color_green_fade: fade(@cryptpad_color_green, 50%);
@cryptpad_color_light_green: #c5ffa8;
@cryptpad_color_light_green_fade: fade(@cryptpad_color_light_green, 20%);
@cryptpad_color_light_yellow: #FFE69C;
@cryptpad_color_yellow_fade: fade(#FFE69C, 50%);
@cryptpad_color_yellow_fade: fade(#FFE69C, 50%); // XXX diff from dark
@cryptpad_color_lighter_blue: #d2e1f2;
@cryptpad_color_link: #0275D8;
@ -118,6 +121,20 @@
@cp_forms-readonly-border: @cryptpad_color_brand;
@cp_forms-disabled: @cryptpad_color_grey_500;
// Bootstrap alerts
@cp_alerts-warning-bg: @cryptpad_color_yellow_fade;
@cp_alerts-warning-fg: @cryptpad_color_light_yellow;
@cp_alerts-warning-text: darken(@cp_alerts-warning-fg, 55%);
@cp_alerts-danger-bg: @cryptpad_color_light_red_fade;
@cp_alerts-danger-fg: @cryptpad_color_light_red;
@cp_alerts-danger-text: darken(@cp_alerts-danger-fg, 55%);
@cp_alerts-info-bg: fade(@cryptpad_color_brand, 15%);
@cp_alerts-info-text: @cryptpad_color_brand;
@cp_alerts-info-fg: @cryptpad_color_brand;
@cp_alerts-success-bg: @cryptpad_color_light_green_fade;
@cp_alerts-success-fg: @cryptpad_color_green;
@cp_alerts-success-text: darken(@cryptpad_color_green, 20%);
// Buttons
@cp_buttons-fg: @cryptpad_color_brand;
@cp_buttons-hover: @cryptpad_color_brand_fadest;

55
customize.dist/src/less2/include/forms.less
View File

@ -207,4 +207,59 @@
}
}
}
// Bootstrap Alerts
.alert {
margin: 0px 0px @alertify_padding-base 0px;
font-size: 12px;
padding: 5px;
border-radius: 0px;
i {
margin-right: 10px;
}
&.cp-alert-top {
margin-top: @alertify_padding-base;
}
a {
color: @cryptpad_text_col;
text-decoration: underline;
}
&.alert-primary {
background-color: fade(@cryptpad_color_brand, 15%);
color: @cp_alertify-fg;
border-color: @cp_alertify-fg;
a {
color: @cp_alertify-fg;
text-decoration: underline;
}
}
&.alert-warning {
background-color: @cp_alerts-warning-bg;
color: @cp_alerts-warning-text;
border-color: @cp_alerts-warning-fg;
}
&.alert-danger {
background-color: @cp_alerts-danger-bg;
color: @cp_alerts-danger-text;
border-color: @cp_alerts-danger-fg;
}
&.alert-info {
background-color: @cp_alerts-info-bg;
color: @cp_alerts-info-text;
border-color: @cp_alerts-info-fg;
}
&.alert-success {
background-color: @cp_alerts-success-bg;
color: @cp_alerts-success-text;
border-color: @cp_alerts-success-fg;
}
&.dismissable {
display: flex;
align-items: center;
span.fa-times {
font-size: @colortheme_app-font-size;
margin-left: 20px;
cursor: pointer;
}
}
}
}

2
customize.dist/src/less2/include/icons.less
View File

@ -11,7 +11,7 @@
padding-top: 5px;
padding-bottom: 5px;
border: 1px solid transparent;
background: @cp_drive-bg;
background: fade(@cryptpad_text_col, 5%);
.cp-icons-name {
width: 100%;

4
customize.dist/src/less2/pages/page-index.less
View File

@ -21,6 +21,10 @@
flex-flow: column;
justify-content: space-around;
justify-content: space-evenly;
.alert-info {
font-size: 16px;
border-radius: 0px;
}
}
}
body {