From e91a477b8b4a158c11a57fa14866625c39611e3d Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Mon, 20 Feb 2023 14:30:38 +0100
Subject: [PATCH] Fix alert padding inside more info dialog (#15477)

---
 src/dialogs/more-info/ha-more-info-dialog.ts | 19 ++++++++++---------
 src/dialogs/more-info/ha-more-info-info.ts   |  6 +++---
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/src/dialogs/more-info/ha-more-info-dialog.ts b/src/dialogs/more-info/ha-more-info-dialog.ts
index 02eb06b797..cc282e5e1d 100644
--- a/src/dialogs/more-info/ha-more-info-dialog.ts
+++ b/src/dialogs/more-info/ha-more-info-dialog.ts
@@ -274,6 +274,7 @@ export class MoreInfoDialog extends LitElement {
           --dialog-content-position: static;
           --vertical-align-dialog: flex-start;
           --dialog-content-padding: 0;
+          --content-padding: 24px;
         }
 
         ha-header-bar {
@@ -299,11 +300,17 @@ export class MoreInfoDialog extends LitElement {
         }
 
         ha-dialog .content {
-          padding: 24px;
+          padding: var(--content-padding);
         }
 
-        :host([tab="settings"]) ha-dialog .content {
-          padding: 0px;
+        :host([tab="settings"]) ha-dialog {
+          --content-padding: 0;
+        }
+
+        :host([tab="info"]) ha-dialog[data-domain="camera"] {
+          --content-padding: 0;
+          /* max height of the video is full screen, minus the height of the header of the dialog and the padding of the dialog (mdc-dialog-max-height: calc(100% - 72px)) */
+          --video-max-height: calc(100vh - 113px - 72px);
         }
 
         @media all and (min-width: 600px) and (min-height: 501px) {
@@ -325,12 +332,6 @@ export class MoreInfoDialog extends LitElement {
             --mdc-dialog-max-width: 90vw;
           }
         }
-
-        :host([tab="info"]) ha-dialog[data-domain="camera"] .content {
-          padding: 0;
-          /* max height of the video is full screen, minus the height of the header of the dialog and the padding of the dialog (mdc-dialog-max-height: calc(100% - 72px)) */
-          --video-max-height: calc(100vh - 113px - 72px);
-        }
       `,
     ];
   }
diff --git a/src/dialogs/more-info/ha-more-info-info.ts b/src/dialogs/more-info/ha-more-info-info.ts
index 005cf6278b..85cb076a4e 100644
--- a/src/dialogs/more-info/ha-more-info-info.ts
+++ b/src/dialogs/more-info/ha-more-info-info.ts
@@ -99,9 +99,9 @@ export class MoreInfoInfo extends LitElement {
 
       ha-alert {
         display: block;
-        margin: calc(-1 * var(--dialog-content-padding, 24px))
-          calc(-1 * var(--dialog-content-padding, 24px)) 16px
-          calc(-1 * var(--dialog-content-padding, 24px));
+        margin: calc(-1 * var(--content-padding, 24px))
+          calc(-1 * var(--content-padding, 24px)) 16px
+          calc(-1 * var(--content-padding, 24px));
       }
     `;
   }