You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
49 lines
2.1 KiB
49 lines
2.1 KiB
@use 'sass:color'; |
|
@use 'functions' as *; |
|
@use 'variables' as *; |
|
|
|
:root { |
|
--dropdown-border-color: #{lighten($ui-base-color, 4%)}; |
|
--dropdown-background-color: #{rgba(darken($ui-base-color, 8%), 0.9)}; |
|
--dropdown-shadow: |
|
0 20px 25px -5px #{color.change($base-shadow-color, $alpha: 0.25)}, |
|
0 8px 10px -6px #{color.change($base-shadow-color, $alpha: 0.25)}; |
|
--modal-background-color: #{rgba(darken($ui-base-color, 8%), 0.7)}; |
|
--modal-background-variant-color: #{color.change($ui-base-color, $alpha: 0.7)}; |
|
--modal-border-color: #{lighten($ui-base-color, 4%)}; |
|
--background-border-color: #{lighten($ui-base-color, 4%)}; |
|
--background-color: #{darken($ui-base-color, 8%)}; |
|
--background-color-tint: #{rgba(darken($ui-base-color, 8%), 0.9)}; |
|
--surface-background-color: #{darken($ui-base-color, 4%)}; |
|
--surface-variant-background-color: #{$ui-base-color}; |
|
--surface-variant-active-background-color: #{lighten($ui-base-color, 4%)}; |
|
--surface-border-color: #{lighten($ui-base-color, 8%)}; |
|
--on-surface-color: #{color.adjust($ui-base-color, $alpha: -0.5)}; |
|
--avatar-border-radius: 8px; |
|
--media-outline-color: #{rgba(#fcf8ff, 0.15)}; |
|
--overlay-icon-shadow: drop-shadow( |
|
0 0 8px #{color.change($base-shadow-color, $alpha: 0.35)} |
|
); |
|
--error-background-color: #{darken($error-red, 16%)}; |
|
--error-active-background-color: #{darken($error-red, 12%)}; |
|
--on-error-color: #fff; |
|
--rich-text-container-color: rgba(87, 24, 60, 100%); |
|
--rich-text-text-color: rgba(255, 175, 212, 100%); |
|
--rich-text-decorations-color: rgba(128, 58, 95, 100%); |
|
--nested-card-background: color(from #{$ui-highlight-color} srgb r g b / 5%); |
|
--nested-card-text: #{$secondary-text-color}; |
|
--nested-card-border: 1px solid |
|
color(from #{$ui-highlight-color} srgb r g b / 15%); |
|
--input-placeholder-color: #{$dark-text-color}; |
|
--input-background-color: var(--surface-variant-background-color); |
|
--on-input-color: #{$secondary-text-color}; |
|
} |
|
|
|
body { |
|
// Variable for easily inverting directional UI elements, |
|
--text-x-direction: 1; |
|
|
|
&.rtl { |
|
--text-x-direction: -1; |
|
} |
|
}
|
|
|