From 7677742d5b4f780a0eff70c6d9d7d7d228fb5b36 Mon Sep 17 00:00:00 2001
From: Aidan Timson <aidan@timmo.dev>
Date: Wed, 17 Dec 2025 12:27:33 +0000
Subject: [PATCH] Revert file

---
 src/components/ha-wa-dialog.ts | 114 +++++++++++----------------------
 1 file changed, 39 insertions(+), 75 deletions(-)

diff --git a/src/components/ha-wa-dialog.ts b/src/components/ha-wa-dialog.ts
index f9f2ecc294..d89f784202 100644
--- a/src/components/ha-wa-dialog.ts
+++ b/src/components/ha-wa-dialog.ts
@@ -233,10 +233,7 @@ export class HaWaDialog extends ScrollableFadeMixin(LitElement) {
             --ha-dialog-border-radius,
             var(--ha-border-radius-3xl)
           );
-          max-width: var(--ha-dialog-max-width, 100vw);
-          max-width: var(--ha-dialog-max-width, 100svw);
-          /* TODO: animate view transition between width changes.
-          Needs https://github.com/home-assistant/frontend/pull/27281 for mixin */
+          max-width: var(--ha-dialog-max-width, var(--safe-width));
         }
         @media (prefers-reduced-motion: reduce) {
           wa-dialog {
@@ -250,7 +247,7 @@ export class HaWaDialog extends ScrollableFadeMixin(LitElement) {
         }
 
         :host([width="large"]) wa-dialog {
-          --width: min(var(--ha-dialog-width-lg, 720px), var(--full-width));
+          --width: min(var(--ha-dialog-width-lg, 1024px), var(--full-width));
         }
 
         :host([width="full"]) wa-dialog {
@@ -262,88 +259,55 @@ export class HaWaDialog extends ScrollableFadeMixin(LitElement) {
           max-width: var(--width, var(--full-width));
           max-height: var(
             --ha-dialog-max-height,
-            calc(100% - var(--ha-space-20))
+            calc(var(--safe-height) - var(--ha-space-20))
           );
           min-height: var(--ha-dialog-min-height);
-          position: var(--dialog-surface-position, relative);
           margin-top: var(--dialog-surface-margin-top, auto);
+          /* Used to offset the dialog from the safe areas when space is limited */
+          transform: translate(
+            calc(
+              var(--safe-area-offset-left, var(--ha-space-0)) - var(
+                  --safe-area-offset-right,
+                  var(--ha-space-0)
+                )
+            ),
+            calc(
+              var(--safe-area-offset-top, var(--ha-space-0)) - var(
+                  --safe-area-offset-bottom,
+                  var(--ha-space-0)
+                )
+            )
+          );
           display: flex;
           flex-direction: column;
           overflow: hidden;
         }
 
         @media all and (max-width: 450px), all and (max-height: 500px) {
-          :host {
+          :host([type="standard"]) {
             --ha-dialog-border-radius: var(--ha-space-0);
-          }
 
-          :host([width="small"]) wa-dialog {
-            --width: min(var(--ha-dialog-width-sm, 320px), var(--full-width));
-          }
+            wa-dialog {
+              /* Make the container fill the whole screen width and not the safe width */
+              --full-width: var(--ha-dialog-width-full, 100vw);
+              --width: var(--full-width);
+            }
 
-          :host([width="large"]) wa-dialog {
-            --width: min(var(--ha-dialog-width-lg, 1024px), var(--full-width));
-          }
-
-          :host([width="full"]) wa-dialog {
-            --width: var(--full-width);
-          }
-
-          wa-dialog::part(dialog) {
-            min-width: var(--width, var(--full-width));
-            max-width: var(--width, var(--full-width));
-            max-height: var(
-              --ha-dialog-max-height,
-              calc(var(--safe-height) - var(--ha-space-20))
-            );
-            min-height: var(--ha-dialog-min-height);
-            margin-top: var(--dialog-surface-margin-top, auto);
-            /* Used to offset the dialog from the safe areas when space is limited */
-            transform: translate(
-              calc(
-                var(--safe-area-offset-left, var(--ha-space-0)) - var(
-                    --safe-area-offset-right,
-                    var(--ha-space-0)
-                  )
-              ),
-              calc(
-                var(--safe-area-offset-top, var(--ha-space-0)) - var(
-                    --safe-area-offset-bottom,
-                    var(--ha-space-0)
-                  )
-              )
-            );
-            display: flex;
-            flex-direction: column;
-            overflow: hidden;
-          }
-
-          @media all and (max-width: 450px), all and (max-height: 500px) {
-            :host([type="standard"]) {
-              --ha-dialog-border-radius: var(--ha-space-0);
-
-              wa-dialog {
-                /* Make the container fill the whole screen width and not the safe width */
-                --full-width: var(--ha-dialog-width-full, 100vw);
-                --width: var(--full-width);
-              }
-
-              wa-dialog::part(dialog) {
-                /* Make the dialog fill the whole screen height and not the safe height */
-                min-height: var(--ha-dialog-min-height, 100vh);
-                min-height: var(--ha-dialog-min-height, 100dvh);
-                max-height: var(--ha-dialog-max-height, 100vh);
-                max-height: var(--ha-dialog-max-height, 100dvh);
-                margin-top: 0;
-                margin-bottom: 0;
-                /* Use safe area as padding instead of the container size */
-                padding-top: var(--safe-area-inset-top);
-                padding-bottom: var(--safe-area-inset-bottom);
-                padding-left: var(--safe-area-inset-left);
-                padding-right: var(--safe-area-inset-right);
-                /* Reset the transform to center the dialog */
-                transform: none;
-              }
+            wa-dialog::part(dialog) {
+              /* Make the dialog fill the whole screen height and not the safe height */
+              min-height: var(--ha-dialog-min-height, 100vh);
+              min-height: var(--ha-dialog-min-height, 100dvh);
+              max-height: var(--ha-dialog-max-height, 100vh);
+              max-height: var(--ha-dialog-max-height, 100dvh);
+              margin-top: 0;
+              margin-bottom: 0;
+              /* Use safe area as padding instead of the container size */
+              padding-top: var(--safe-area-inset-top);
+              padding-bottom: var(--safe-area-inset-bottom);
+              padding-left: var(--safe-area-inset-left);
+              padding-right: var(--safe-area-inset-right);
+              /* Reset the transform to center the dialog */
+              transform: none;
             }
           }
         }