fix:#53 revert toast color intensity

This commit is contained in:
Elmar Kresse
2024-09-07 10:03:31 +02:00
parent c5cd7e0822
commit a9234cbb16

View File

@ -1,40 +1,40 @@
$colors: ( $colors: (
"blue": #004699, "blue": #004699,
"green": #00964e, "green": #00964e,
"yellow": #ffed00, "yellow": #ffed00,
"cyan": #009ee3, "cyan": #009ee3,
"pink": #e5007d, "pink": #e5007d,
"indigo": #6366f1, "indigo": #6366f1,
"teal": #14b8a6, "teal": #14b8a6,
"orange": #f97316, "orange": #f97316,
"bluegray": #64748b, "bluegray": #64748b,
"purple": #a855f7, "purple": #a855f7,
"red": #e53009, "red": #e53009,
"primary": $primaryColor, "primary": $primaryColor,
"htwk-yellow": #ffed00, "htwk-yellow": #ffed00,
"htwk-yellow-24": rgba(255, 237, 0, 0.24), "htwk-yellow-24": rgba(255, 237, 0, 0.24),
"htwk-yellow-16": rgba(255, 237, 0, 0.16), "htwk-yellow-16": rgba(255, 237, 0, 0.16),
"htwk-yellow-01": rgba(255, 237, 0, 0.1), "htwk-yellow-01": rgba(255, 237, 0, 0.1),
"htwk-magenta": #e5007d, "htwk-magenta": #e5007d,
"htwk-rot": #e53009, "htwk-rot": #e53009,
"htwk-gruen": #00964e, "htwk-gruen": #00964e,
"htwk-cyan": #009ee3, "htwk-cyan": #009ee3,
"htwk-blau": #004699, "htwk-blau": #004699,
"htwk-silbergrau": #bec3c6, "htwk-silbergrau": #bec3c6,
"htwk-silbergrau-80": #cbd3d1, "htwk-silbergrau-80": #cbd3d1,
"htwk-silbergrau-60": #d8dedc, "htwk-silbergrau-60": #d8dedc,
"htwk-silbergrau-40": #e5e9e8, "htwk-silbergrau-40": #e5e9e8,
"htwk-grau-140": #1b2022, "htwk-grau-140": #1b2022,
"htwk-grau-120": #242b2d, "htwk-grau-120": #242b2d,
"htwk-grau": #2e3639, "htwk-grau": #2e3639,
"htwk-grau-80": #575e60, "htwk-grau-80": #575e60,
"htwk-grau-60": #818688, "htwk-grau-60": #818688,
"htwk-grau-40": #abaeaf, "htwk-grau-40": #abaeaf,
"htwk-dunkelblau": #022541, "htwk-dunkelblau": #022541,
"htwk-dunkelblau-80": #345067, "htwk-dunkelblau-80": #345067,
"htwk-dunkelblau-60": #677c8d, "htwk-dunkelblau-60": #677c8d,
"htwk-dunkelblau-40": #99a7b3, "htwk-dunkelblau-40": #99a7b3,
"htwk-schwarz": #000000, "htwk-schwarz": #000000,
); );
//shades //shades
@ -136,7 +136,7 @@ $inputOverlayBg: $inputListBg !default;
$inputOverlayHeaderBg: $inputListHeaderBg !default; $inputOverlayHeaderBg: $inputListHeaderBg !default;
$inputOverlayBorder: 1px solid $shade600 !default; $inputOverlayBorder: 1px solid $shade600 !default;
$inputOverlayShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), $inputOverlayShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2),
0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12) !default; 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12) !default;
//password //password
$passwordMeterBg: $shade600 !default; $passwordMeterBg: $shade600 !default;
@ -158,7 +158,7 @@ $buttonActiveBg: $primaryLighterColor !default;
$buttonTextActiveColor: $primaryTextColor !default; $buttonTextActiveColor: $primaryTextColor !default;
$buttonActiveBorderColor: $primaryLighterColor !default; $buttonActiveBorderColor: $primaryLighterColor !default;
$raisedButtonShadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), $raisedButtonShadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2),
0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !default; 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !default;
$roundedButtonBorderRadius: 2rem !default; $roundedButtonBorderRadius: 2rem !default;
$textButtonHoverBgOpacity: 0.04 !default; $textButtonHoverBgOpacity: 0.04 !default;
@ -178,7 +178,7 @@ $secondaryButtonActiveBg: #e2e8f0 !default;
$secondaryButtonTextActiveColor: $secondaryButtonTextColor !default; $secondaryButtonTextActiveColor: $secondaryButtonTextColor !default;
$secondaryButtonActiveBorderColor: #e2e8f0 !default; $secondaryButtonActiveBorderColor: #e2e8f0 !default;
$secondaryButtonFocusShadow: 0 0 0 1px $secondaryButtonFocusShadow: 0 0 0 1px
scale-color($secondaryButtonBg, $lightness: 30%) !default; scale-color($secondaryButtonBg, $lightness: 30%) !default;
$infoButtonBg: map-get($colors, "htwk-blau") !default; $infoButtonBg: map-get($colors, "htwk-blau") !default;
$infoButtonTextColor: #b1dafa !default; $infoButtonTextColor: #b1dafa !default;
@ -201,7 +201,7 @@ $successButtonActiveBg: #bbf7d0 !default;
$successButtonTextActiveColor: $successButtonTextColor !default; $successButtonTextActiveColor: $successButtonTextColor !default;
$successButtonActiveBorderColor: #bbf7d0 !default; $successButtonActiveBorderColor: #bbf7d0 !default;
$successButtonFocusShadow: 0 0 0 1px $successButtonFocusShadow: 0 0 0 1px
scale-color($successButtonBg, $lightness: 30%) !default; scale-color($successButtonBg, $lightness: 30%) !default;
$warningButtonBg: map-get($colors, "htwk-yellow") !default; $warningButtonBg: map-get($colors, "htwk-yellow") !default;
$warningButtonTextColor: #493c08 !default; $warningButtonTextColor: #493c08 !default;
@ -213,7 +213,7 @@ $warningButtonActiveBg: scale-color($warningButtonBg, $lightness: 30%) !default;
$warningButtonTextActiveColor: $warningButtonTextColor !default; $warningButtonTextActiveColor: $warningButtonTextColor !default;
$warningButtonActiveBorderColor: scale-color($warningButtonBg, $lightness: 30%) !default; $warningButtonActiveBorderColor: scale-color($warningButtonBg, $lightness: 30%) !default;
$warningButtonFocusShadow: 0 0 0 1px $warningButtonFocusShadow: 0 0 0 1px
scale-color($warningButtonBg, $lightness: 30%) !default; scale-color($warningButtonBg, $lightness: 30%) !default;
$helpButtonBg: #c084fc !default; $helpButtonBg: #c084fc !default;
$helpButtonTextColor: #3b0764 !default; $helpButtonTextColor: #3b0764 !default;
@ -236,7 +236,7 @@ $dangerButtonActiveBg: #fecaca !default;
$dangerButtonTextActiveColor: $dangerButtonTextColor !default; $dangerButtonTextActiveColor: $dangerButtonTextColor !default;
$dangerButtonActiveBorderColor: #fecaca !default; $dangerButtonActiveBorderColor: #fecaca !default;
$dangerButtonFocusShadow: 0 0 0 1px $dangerButtonFocusShadow: 0 0 0 1px
scale-color($dangerButtonBg, $lightness: 30%) !default; scale-color($dangerButtonBg, $lightness: 30%) !default;
$contrastButtonBg: #ffffff !default; $contrastButtonBg: #ffffff !default;
$contrastButtonTextColor: $shade900 !default; $contrastButtonTextColor: $shade900 !default;
@ -479,7 +479,7 @@ $cardSubTitleColor: $shade100 !default;
$cardContentPadding: 1.25rem 0 !default; $cardContentPadding: 1.25rem 0 !default;
$cardFooterPadding: 1.25rem 0 0 0 !default; $cardFooterPadding: 1.25rem 0 0 0 !default;
$cardShadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), $cardShadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14),
0 1px 3px 0 rgba(0, 0, 0, 0.12) !default; 0 1px 3px 0 rgba(0, 0, 0, 0.12) !default;
//editor //editor
$editorToolbarBg: $panelHeaderBg !default; $editorToolbarBg: $panelHeaderBg !default;
@ -616,21 +616,21 @@ $toastTitleFontWeight: 0 !default;
$toastDetailMargin: $inlineSpacing 0 0 0 !default; $toastDetailMargin: $inlineSpacing 0 0 0 !default;
//severities //severities
$infoMessageBg: rgba(59, 130, 246, 0.7) !default; $infoMessageBg: rgba(59, 130, 246, 0.2) !default;
$infoMessageBorder: solid #3b82f6 !default; $infoMessageBorder: solid #3b82f6 !default;
$infoMessageTextColor: #b9d7ff !default; $infoMessageTextColor: #93c5fd !default;
$infoMessageIconColor: #93c5fd !default; $infoMessageIconColor: #93c5fd !default;
$successMessageBg: rgba(16, 185, 129, 0.7) !default; $successMessageBg: rgba(16, 185, 129, 0.2) !default;
$successMessageBorder: solid #10b981 !default; $successMessageBorder: solid #10b981 !default;
$successMessageTextColor: #8aecc6 !default; $successMessageTextColor: #6ee7b7 !default;
$successMessageIconColor: #6ee7b7 !default; $successMessageIconColor: #6ee7b7 !default;
$warningMessageBg: rgba(234, 179, 8, 0.7) !default; $warningMessageBg: rgba(234, 179, 8, 0.2) !default;
$warningMessageBorder: solid #eab308 !default; $warningMessageBorder: solid #eab308 !default;
$warningMessageTextColor: #ffea84 !default; $warningMessageTextColor: #fde047 !default;
$warningMessageIconColor: #fde047 !default; $warningMessageIconColor: #fde047 !default;
$errorMessageBg: rgba(239, 68, 68, 0.7) !default; $errorMessageBg: rgba(239, 68, 68, 0.2) !default;
$errorMessageBorder: solid #ef4444 !default; $errorMessageBorder: solid #ef4444 !default;
$errorMessageTextColor: #ffe9e9 !default; $errorMessageTextColor: #fca5a5 !default;
$errorMessageIconColor: #fca5a5 !default; $errorMessageIconColor: #fca5a5 !default;
$secondaryMessageBg: $secondaryButtonBg !default; $secondaryMessageBg: $secondaryButtonBg !default;
$secondaryMessageBorder: solid $secondaryButtonBg !default; $secondaryMessageBorder: solid $secondaryButtonBg !default;
@ -645,7 +645,7 @@ $contrastMessageIconColor: $contrastButtonTextColor !default;
$overlayContentBorder: 1px solid $shade600 !default; $overlayContentBorder: 1px solid $shade600 !default;
$overlayContentBg: $panelContentBg !default; $overlayContentBg: $panelContentBg !default;
$overlayContainerShadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), $overlayContainerShadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2),
0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !default; 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !default;
//dialog //dialog
$dialogHeaderBg: $shade800 !default; $dialogHeaderBg: $shade800 !default;
@ -720,7 +720,7 @@ $submenuHeaderFontWeight: 0 !default;
$overlayMenuBg: $menuBg !default; $overlayMenuBg: $menuBg !default;
$overlayMenuBorder: 1px solid $shade600 !default; $overlayMenuBorder: 1px solid $shade600 !default;
$overlayMenuShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), $overlayMenuShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2),
0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12) !default; 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12) !default;
$verticalMenuPadding: 0.25rem 0 !default; $verticalMenuPadding: 0.25rem 0 !default;
$menuSeparatorMargin: 0.25rem 0 !default; $menuSeparatorMargin: 0.25rem 0 !default;
@ -887,55 +887,55 @@ $imagePreviewActionIconFontSize: 1.5rem !default;
$imagePreviewActionIconBorderRadius: 50% !default; $imagePreviewActionIconBorderRadius: 50% !default;
:root { :root {
font-family: "Twemoji Country Flags", "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; font-family: "Twemoji Country Flags", "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-feature-settings: "cv02", "cv03", "cv04", "cv11"; font-feature-settings: "cv02", "cv03", "cv04", "cv11";
font-variation-settings: normal; font-variation-settings: normal;
--font-family: "Twemoji Country Flags", "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; --font-family: "Twemoji Country Flags", "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-feature-settings: "cv02", "cv03", "cv04", "cv11"; --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
--surface-a: #{$shade800}; --surface-a: #{$shade800};
--surface-b: #{$shade900}; --surface-b: #{$shade900};
--surface-c: #{$hoverBg}; --surface-c: #{$hoverBg};
--surface-d: #{$shade600}; --surface-d: #{$shade600};
--surface-e: #{$shade800}; --surface-e: #{$shade800};
--surface-f: #{$shade800}; --surface-f: #{$shade800};
--text-color: #{$shade000}; --text-color: #{$shade000};
--text-color-secondary: #{$shade100}; --text-color-secondary: #{$shade100};
--primary-color: #{$primaryColor}; --primary-color: #{$primaryColor};
--primary-color-text: #{$primaryTextColor}; --primary-color-text: #{$primaryTextColor};
--surface-0: #{map-get($colors, "htwk-schwarz")}; --surface-0: #{map-get($colors, "htwk-schwarz")};
--surface-50: #1d2530; --surface-50: #1d2530;
--surface-100: #363d47; --surface-100: #363d47;
--surface-200: #4f565e; --surface-200: #4f565e;
--surface-300: #686e75; --surface-300: #686e75;
--surface-400: #82868c; --surface-400: #82868c;
--surface-500: #9b9ea3; --surface-500: #9b9ea3;
--surface-600: #b4b6ba; --surface-600: #b4b6ba;
--surface-700: #cdcfd1; --surface-700: #cdcfd1;
--surface-800: #e6e7e8; --surface-800: #e6e7e8;
--surface-900: #ffffff; --surface-900: #ffffff;
--gray-50: #e6e7e8; --gray-50: #e6e7e8;
--gray-100: #cdcfd1; --gray-100: #cdcfd1;
--gray-200: #b4b6ba; --gray-200: #b4b6ba;
--gray-300: #9b9ea3; --gray-300: #9b9ea3;
--gray-400: #82868c; --gray-400: #82868c;
--gray-500: #686e75; --gray-500: #686e75;
--gray-600: #4f565e; --gray-600: #4f565e;
--gray-700: #363d47; --gray-700: #363d47;
--gray-800: #1d2530; --gray-800: #1d2530;
--gray-900: #{map-get($colors, "htwk-schwarz")}; --gray-900: #{map-get($colors, "htwk-schwarz")};
--content-padding: #{$panelContentPadding}; --content-padding: #{$panelContentPadding};
--inline-spacing: #{$inlineSpacing}; --inline-spacing: #{$inlineSpacing};
--border-radius: #{$borderRadius}; --border-radius: #{$borderRadius};
--surface-ground: #{map-get($colors, "htwk-grau")}; --surface-ground: #{map-get($colors, "htwk-grau")};
--surface-section: #{map-get($colors, "htwk-grau")}; --surface-section: #{map-get($colors, "htwk-grau")};
--surface-card: #{map-get($colors, "htwk-grau")}; --surface-card: #{map-get($colors, "htwk-grau")};
--surface-overlay: #{map-get($colors, "htwk-grau")}; --surface-overlay: #{map-get($colors, "htwk-grau")};
--surface-border: #{map-get($colors, "htwk-dunkelblau-60")}; --surface-border: #{map-get($colors, "htwk-dunkelblau-60")};
--surface-hover: rgba(255, 255, 255, 0.03); --surface-hover: rgba(255, 255, 255, 0.03);
--focus-ring: #{$focusShadow}; --focus-ring: #{$focusShadow};
--maskbg: #{$maskBg}; --maskbg: #{$maskBg};
--highlight-bg: #{$highlightBg}; --highlight-bg: #{$highlightBg};
--highlight-text-color: #{$highlightTextColor}; --highlight-text-color: #{$highlightTextColor};
color-scheme: dark; color-scheme: dark;
background-color: #{map-get($colors, "htwk-grau-140")}; background-color: #{map-get($colors, "htwk-grau-140")};
} }