Home-Assistant
/
frontend
mirror of https://github.com/home-assistant/frontend.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Align box shadows (#26835) 

* Align box shadows

* update colors
pull/26848/head
Bram Kragten 2025-09-02 16:15:48 +02:00 committed by GitHub
parent f3b214c30a
commit 5a109c0ba8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/ha-md-dialog.ts
View File

@ -159,6 +159,7 @@ export class HaMdDialog extends Dialog {
--md-dialog-headline-size: var(--ha-font-size-xl);
--md-dialog-supporting-text-size: var(--ha-font-size-m);
--md-dialog-supporting-text-line-height: var(--ha-line-height-normal);
--md-divider-color: var(--divider-color);
}
:host([type="alert"]) {

5
src/panels/config/automation/sidebar/ha-automation-sidebar-card.ts
View File

@ -180,7 +180,7 @@ export default class HaAutomationSidebarCard extends LitElement {
}
ha-dialog-header.scrolled {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
box-shadow: var(--bar-box-shadow);
}
.fade {
@ -194,7 +194,8 @@ export default class HaAutomationSidebarCard extends LitElement {
}
.fade.scrollable {
box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.16);
box-shadow: var(--bar-box-shadow);
transform: rotate(180deg);
}
.card-content {

4
src/resources/theme/color/color.globals.ts
View File

@ -218,6 +218,7 @@ export const colorStyles = css`
--table-row-alternative-background-color: var(--secondary-background-color);
--data-table-background-color: var(--card-background-color);
--markdown-code-background-color: var(--primary-background-color);
--bar-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.16);
/* https://github.com/material-components/material-web/blob/master/docs/theming.md */
--mdc-theme-primary: var(--primary-color);
@ -246,6 +247,7 @@ export const colorStyles = css`
--mdc-dialog-scroll-divider-color: var(--divider-color);
--mdc-dialog-heading-ink-color: var(--primary-text-color);
--mdc-dialog-content-ink-color: var(--primary-text-color);
--mdc-top-app-bar-fixed-box-shadow: var(--bar-box-shadow);
--mdc-text-field-idle-line-color: var(--input-idle-line-color);
--mdc-text-field-hover-line-color: var(--input-hover-line-color);
@ -360,6 +362,8 @@ export const darkColorStyles = css`
--ha-button-warning-light-color: #917b54c1;
--ha-button-neutral-color: #d9dae0;
--ha-button-neutral-light-color: #6a7081;
--bar-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.48);
}
`;