diff --git a/packages/devextreme-scss/scss/widgets/generic/chat/_colors.scss b/packages/devextreme-scss/scss/widgets/generic/chat/_colors.scss index b3f87001d83e..16a6ba699261 100644 --- a/packages/devextreme-scss/scss/widgets/generic/chat/_colors.scss +++ b/packages/devextreme-scss/scss/widgets/generic/chat/_colors.scss @@ -29,7 +29,7 @@ $chat-messagelist-empty-prompt-color: null !default; $chat-messagelist-empty-prompt-color: lighten($base-label-color, 38.43) !default; // #959595 } -@else if $color == "dark" { +@if $color == "dark" { $chat-avatar-background-color: lighten($base-bg, 13.73) !default; // #4D4D4D $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.07), 5.10), 0.1) !default; // #1997C61A $chat-bubble-background-color-secondary: lighten($base-bg, 3.92) !default; // #343434 @@ -40,3 +40,75 @@ $chat-messagelist-empty-prompt-color: null !default; $chat-messagelist-empty-message-color: lighten($base-text-color, 12.94) !default; // #FFFFFF $chat-messagelist-empty-prompt-color: darken($base-label-color, 38.04) !default; // #7D7D7D } + +@if $color == "carmine" { + $chat-avatar-background-color: darken($base-bg, 13.33) !default; // #DDDDDD + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.32), 5.10), 0.1) !default; // #2D6DA31A + $chat-bubble-background-color-secondary: darken($base-bg, 3.92) !default; // #F5F5F5 + $chat-information-color: darken($base-bg, 41.57) !default; // #959595 + + $chat-messagelist-empty-icon-color: lighten($base-icon-color, 46.67) !default; // #AAAAAA + $chat-messagelist-empty-icon-background-color: darken($base-bg, 7.84) !default; // #EBEBEB + $chat-messagelist-empty-message-color: darken($base-text-color, 6.67) !default; // #222222 + $chat-messagelist-empty-prompt-color: lighten($base-label-color, 38.43) !default; // #959595 +} + +@if $color == "contrast" { + $chat-avatar-background-color: lighten($base-bg, 13.73) !default; // #4D4D4D + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.07), 5.10), 0.1) !default; // #1997C61A + $chat-bubble-background-color-secondary: lighten($base-bg, 3.92) !default; // #343434 + $chat-information-color: lighten($base-bg, 32.55) !default; // #7D7D7D + + $chat-messagelist-empty-icon-color: darken(#dedede, 37.25) !default; // #7F7F7F + $chat-messagelist-empty-icon-background-color: lighten($base-bg, 7.84) !default; // #3E3E3E + $chat-messagelist-empty-message-color: lighten($base-text-color, 12.94) !default; // #FFFFFF + $chat-messagelist-empty-prompt-color: darken($base-label-color, 38.04) !default; // #7D7D7D +} + +@if $color == "darkmoon" { + $chat-avatar-background-color: lighten($base-bg, 13.73) !default; // #4D4D4D + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.07), 5.10), 0.1) !default; // #1997C61A + $chat-bubble-background-color-secondary: lighten($base-bg, 3.92) !default; // #343434 + $chat-information-color: lighten($base-bg, 32.55) !default; // #7D7D7D + + $chat-messagelist-empty-icon-color: darken(#dedede, 37.25) !default; // #7F7F7F + $chat-messagelist-empty-icon-background-color: lighten($base-bg, 7.84) !default; // #3E3E3E + $chat-messagelist-empty-message-color: lighten($base-text-color, 12.94) !default; // #FFFFFF + $chat-messagelist-empty-prompt-color: darken($base-label-color, 38.04) !default; // #7D7D7D +} + +@if $color == "darkviolet" { + $chat-avatar-background-color: lighten($base-bg, 13.73) !default; // #4D4D4D + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.07), 5.10), 0.1) !default; // #1997C61A + $chat-bubble-background-color-secondary: lighten($base-bg, 3.92) !default; // #343434 + $chat-information-color: lighten($base-bg, 32.55) !default; // #7D7D7D + + $chat-messagelist-empty-icon-color: darken(#dedede, 37.25) !default; // #7F7F7F + $chat-messagelist-empty-icon-background-color: lighten($base-bg, 7.84) !default; // #3E3E3E + $chat-messagelist-empty-message-color: lighten($base-text-color, 12.94) !default; // #FFFFFF + $chat-messagelist-empty-prompt-color: darken($base-label-color, 38.04) !default; // #7D7D7D +} + +@if $color == "greenmist" { + $chat-avatar-background-color: darken($base-bg, 13.33) !default; // #DDDDDD + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.32), 5.10), 0.1) !default; // #2D6DA31A + $chat-bubble-background-color-secondary: darken($base-bg, 3.92) !default; // #F5F5F5 + $chat-information-color: darken($base-bg, 41.57) !default; // #959595 + + $chat-messagelist-empty-icon-color: lighten($base-icon-color, 46.67) !default; // #AAAAAA + $chat-messagelist-empty-icon-background-color: darken($base-bg, 7.84) !default; // #EBEBEB + $chat-messagelist-empty-message-color: darken($base-text-color, 6.67) !default; // #222222 + $chat-messagelist-empty-prompt-color: lighten($base-label-color, 38.43) !default; // #959595 +} + +@if $color == "softblue" { + $chat-avatar-background-color: darken($base-bg, 13.33) !default; // #DDDDDD + $chat-bubble-background-color-primary: rgba(darken(saturate($base-accent, 0.32), 5.10), 0.1) !default; // #2D6DA31A + $chat-bubble-background-color-secondary: darken($base-bg, 3.92) !default; // #F5F5F5 + $chat-information-color: darken($base-bg, 41.57) !default; // #959595 + + $chat-messagelist-empty-icon-color: lighten($base-icon-color, 46.67) !default; // #AAAAAA + $chat-messagelist-empty-icon-background-color: darken($base-bg, 7.84) !default; // #EBEBEB + $chat-messagelist-empty-message-color: darken($base-text-color, 6.67) !default; // #222222 + $chat-messagelist-empty-prompt-color: lighten($base-label-color, 38.43) !default; // #959595 +}