CGM_Public/pretix_original
2
0
Fork 1
mirror of https://github.com/pretix/pretix.git synced 2026-05-08 15:44:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use tint/shade to make alert-colors more robust

Browse Source
This commit is contained in:
Richard Schreiber
2024-11-20 11:25:46 +01:00
parent fcff5a522d
commit 791aa60f6c
2 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/pretix/static/pretixbase/scss/_bootstrap_vars.scss
View File

@@ -122,29 +122,29 @@ $label-warning-bg-hover: var(--pretix-brand-warning-darken-10);
$label-danger-bg: var(--pretix-brand-danger); $label-danger-bg: var(--pretix-brand-danger);
$label-danger-bg-hover: var(--pretix-brand-danger-darken-10); $label-danger-bg-hover: var(--pretix-brand-danger-darken-10);
$alert-success-bg: var(--pretix-brand-success-lighten-48); $alert-success-bg: var(--pretix-brand-success-tint-85);
$alert-success-text: var(--pretix-brand-success-darken-10); $alert-success-text: var(--pretix-brand-success-shade-42);
$alert-success-border: var(--pretix-brand-success); $alert-success-border: var(--pretix-brand-success);
$alert-success-hr: var(--pretix-brand-success-darken-5); $alert-success-hr: var(--pretix-brand-success-darken-5);
$alert-success-link: var(--pretix-brand-success-darken-20); $alert-success-link: var(--pretix-brand-success-shade-42);
$alert-info-bg: var(--pretix-brand-info-lighten-33); $alert-info-bg: var(--pretix-brand-info-tint-85);
$alert-info-text: var(--pretix-brand-info-darken-20); $alert-info-text: var(--pretix-brand-info-shade-42);
$alert-info-border: var(--pretix-brand-info); $alert-info-border: var(--pretix-brand-info);
$alert-info-hr: var(--pretix-brand-info-darken-5); $alert-info-hr: var(--pretix-brand-info-darken-5);
$alert-info-link: var(--pretix-brand-info-darken-30); $alert-info-link: var(--pretix-brand-info-shade-42);
$alert-warning-bg: var(--pretix-brand-warning-lighten-41); $alert-warning-bg: var(--pretix-brand-warning-tint-85);
$alert-warning-text: var(--pretix-brand-warning-darken-25); $alert-warning-text: var(--pretix-brand-warning-shade-42);
$alert-warning-border: var(--pretix-brand-warning); $alert-warning-border: var(--pretix-brand-warning);
$alert-warning-hr: var(--pretix-brand-warning-darken-5); $alert-warning-hr: var(--pretix-brand-warning-darken-5);
$alert-warning-link: var(--pretix-brand-warning-darken-35); $alert-warning-link: var(--pretix-brand-warning-shade-42);
$alert-danger-bg: var(--pretix-brand-danger-lighten-43); $alert-danger-bg: var(--pretix-brand-danger-tint-85);
$alert-danger-text: var(--pretix-brand-danger-darken-5); $alert-danger-text: var(--pretix-brand-danger-shade-42);
$alert-danger-border: var(--pretix-brand-danger); $alert-danger-border: var(--pretix-brand-danger);
$alert-danger-hr: var(--pretix-brand-danger-darken-5); $alert-danger-hr: var(--pretix-brand-danger-darken-5);
$alert-danger-link: var(--pretix-brand-danger-darken-15); $alert-danger-link: var(--pretix-brand-danger-shade-42);
$main-box-bg: #FFFFFF; $main-box-bg: #FFFFFF;
@@ -156,4 +156,4 @@ $slider-secondary-bottom: var(--pretix-brand-primary-lighten-23-saturate-2);
/* The following vars default to $body-bg in bootstrap, which we don't want */ /* The following vars default to $body-bg in bootstrap, which we don't want */
$nav-tabs-active-link-hover-bg: #FFFFFF; $nav-tabs-active-link-hover-bg: #FFFFFF;
$nav-tabs-justified-active-link-border-color: #FFFFFF; $nav-tabs-justified-active-link-border-color: #FFFFFF;
$thumbnail-bg: #FFFFFF; $thumbnail-bg: #FFFFFF;

10
src/pretix/static/pretixbase/scss/_theme_variables.scss
View File

@@ -73,7 +73,9 @@ $in-border-radius-small: 2px !default;
--pretix-brand-success-darken-20: #{darken($in-brand-success, 20%)}; --pretix-brand-success-darken-20: #{darken($in-brand-success, 20%)};
--pretix-brand-success-darken-30: #{darken($in-brand-success, 30%)}; --pretix-brand-success-darken-30: #{darken($in-brand-success, 30%)};
--pretix-brand-success-tint-50: #{tint($in-brand-success, 50%)}; --pretix-brand-success-tint-50: #{tint($in-brand-success, 50%)};
--pretix-brand-success-tint-85: #{tint($in-brand-success, 85%)};
--pretix-brand-success-shade-25: #{shade($in-brand-success, 25%)}; --pretix-brand-success-shade-25: #{shade($in-brand-success, 25%)};
--pretix-brand-success-shade-42: #{shade($in-brand-success, 42%)};
--pretix-brand-info-lighten-23: #{lighten($in-brand-info, 23%)}; --pretix-brand-info-lighten-23: #{lighten($in-brand-info, 23%)};
--pretix-brand-info-lighten-25: #{lighten($in-brand-info, 25%)}; --pretix-brand-info-lighten-25: #{lighten($in-brand-info, 25%)};
@@ -84,7 +86,9 @@ $in-border-radius-small: 2px !default;
--pretix-brand-info-darken-17: #{darken($in-brand-info, 17%)}; --pretix-brand-info-darken-17: #{darken($in-brand-info, 17%)};
--pretix-brand-info-darken-20: #{darken($in-brand-info, 20%)}; --pretix-brand-info-darken-20: #{darken($in-brand-info, 20%)};
--pretix-brand-info-darken-30: #{darken($in-brand-info, 30%)}; --pretix-brand-info-darken-30: #{darken($in-brand-info, 30%)};
--pretix-brand-info-tint-85: #{tint($in-brand-info, 85%)};
--pretix-brand-info-shade-25: #{shade($in-brand-info, 25%)}; --pretix-brand-info-shade-25: #{shade($in-brand-info, 25%)};
--pretix-brand-info-shade-42: #{shade($in-brand-info, 42%)};
--pretix-brand-warning-lighten-12: #{lighten($in-brand-warning, 12%)}; --pretix-brand-warning-lighten-12: #{lighten($in-brand-warning, 12%)};
--pretix-brand-warning-lighten-31: #{lighten($in-brand-warning, 31%)}; --pretix-brand-warning-lighten-31: #{lighten($in-brand-warning, 31%)};
@@ -101,7 +105,9 @@ $in-border-radius-small: 2px !default;
--pretix-brand-warning-darken-30: #{darken($in-brand-warning, 30%)}; --pretix-brand-warning-darken-30: #{darken($in-brand-warning, 30%)};
--pretix-brand-warning-darken-35: #{darken($in-brand-warning, 35%)}; --pretix-brand-warning-darken-35: #{darken($in-brand-warning, 35%)};
--pretix-brand-warning-tint-50: #{tint($in-brand-warning, 50%)}; --pretix-brand-warning-tint-50: #{tint($in-brand-warning, 50%)};
--pretix-brand-warning-tint-85: #{tint($in-brand-warning, 85%)};
--pretix-brand-warning-shade-25: #{shade($in-brand-warning, 25%)}; --pretix-brand-warning-shade-25: #{shade($in-brand-warning, 25%)};
--pretix-brand-warning-shade-42: #{shade($in-brand-warning, 42%)};
--pretix-brand-warning-transparent-60: #{transparentize($in-brand-warning, 0.6)}; --pretix-brand-warning-transparent-60: #{transparentize($in-brand-warning, 0.6)};
--pretix-brand-danger-lighten-5: #{lighten($in-brand-danger, 5%)}; --pretix-brand-danger-lighten-5: #{lighten($in-brand-danger, 5%)};
@@ -118,7 +124,9 @@ $in-border-radius-small: 2px !default;
--pretix-brand-danger-darken-20: #{darken($in-brand-danger, 20%)}; --pretix-brand-danger-darken-20: #{darken($in-brand-danger, 20%)};
--pretix-brand-danger-darken-30: #{darken($in-brand-danger, 30%)}; --pretix-brand-danger-darken-30: #{darken($in-brand-danger, 30%)};
--pretix-brand-danger-tint-50: #{tint($in-brand-danger, 50%)}; --pretix-brand-danger-tint-50: #{tint($in-brand-danger, 50%)};
--pretix-brand-danger-tint-85: #{tint($in-brand-danger, 85%)};
--pretix-brand-danger-shade-25: #{shade($in-brand-danger, 25%)}; --pretix-brand-danger-shade-25: #{shade($in-brand-danger, 25%)};
--pretix-brand-danger-shade-42: #{shade($in-brand-danger, 42%)};
--pretix-border-radius-base: #{$in-border-radius-base}; --pretix-border-radius-base: #{$in-border-radius-base};
--pretix-border-radius-large: #{$in-border-radius-large}; --pretix-border-radius-large: #{$in-border-radius-large};
@@ -140,4 +148,4 @@ $in-border-radius-small: 2px !default;
--pretix-body-bg-white-0: 1; --pretix-body-bg-white-0: 1;
} }
} }
} }