jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-11-09 02:49:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix mobile ha-dialog height in Browser (#27298)

Browse Source 
Enhance dialog responsiveness by adjusting min/max height to use svh units
This commit is contained in:
Wendelin
2025-10-03 12:48:08 +02:00
committed by Bram Kragten
parent c9feb0b75f
commit e899587307
2 changed files with 6 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ha-dialog.ts
View File

@@ -139,7 +139,9 @@ export class HaDialog extends DialogBase {
@media all and (max-width: 450px), all and (max-height: 500px) {
.mdc-dialog .mdc-dialog__surface {
min-height: 100vh;
min-height: 100svh;
max-height: 100vh;
max-height: 100svh;
padding-top: var(--safe-area-inset-top);
padding-bottom: var(--safe-area-inset-bottom);
padding-left: var(--safe-area-inset-left);

6
src/resources/styles.ts
View File

@@ -157,8 +157,10 @@ export const haStyleDialog = css`
ha-dialog {
--mdc-dialog-min-width: 100vw;
--mdc-dialog-max-width: 100vw;
--mdc-dialog-min-height: 100%;
--mdc-dialog-max-height: 100%;
--mdc-dialog-min-height: 100vh;
--mdc-dialog-min-height: 100svh;
--mdc-dialog-max-height: 100vh;
--mdc-dialog-max-height: 100svh;
--vertical-align-dialog: flex-end;
--ha-dialog-border-radius: 0;
}