Bug 1797313 - Fix alert/confirm dialog layout after bug 1779695. r=Gijs

max-height percentages were not honored, which caused the infoRow to
collapse. With min-height: 0 the info row shrinks too much.

Differential Revision: https://phabricator.services.mozilla.com/D160227

toolkit/components/prompts/content/commonDialog.css

@@ -40,21 +40,22 @@ dialog[insecureauth] {
   white-space: pre-wrap;
   word-break: break-word;
   unicode-bidi: plaintext;
-}
-
-.sizeDetermined #infoBody {
   overflow-y: auto;
 }
 
 .sizeDetermined,
-.sizeDetermined::part(content-box) {
-  display: flex;
-  flex-direction: column;
+.sizeDetermined::part(content-box),
+.sizeDetermined #infoBody,
+.sizeDetermined #infoRow,
+.sizeDetermined #infoContainer {
+  /* Allow stuff to shrink */
   min-height: 0;
 }
 
-.sizeDetermined > div {
-  display: contents;
+.sizeDetermined #infoRow {
+  /* Make the info row take all the available space, potentially shrinking,
+   * since it's what contains the infoBody, which is scrollable */
+  flex: 1;
 }
 
 #loginLabel, #password1Label {
@@ -76,23 +77,6 @@ dialog[subdialog] .dialogRow:not([hidden]) {
   align-items: stretch;
 }
 
-dialog[subdialog] #infoContainer {
-  max-height: 100%;
-}
-
-dialog[subdialog] #infoContainer,
-dialog[subdialog] #checkboxContainer {
-  /* Needed to ensure text wrapping happens correctly. Without this, when
-   * text wraps unexpectedly, the overall dialog height is off by the height
-   * of a line of text. This is 100% of the width, minus the grid padding, 8px
-   * of which is inline padding on the contents of these containers. */
-  max-width: calc(100vw - 2 * var(--grid-padding) + 8px);
-}
-
-.sizeDetermined #infoRow {
-  min-height: 0;
-}
-
 dialog[subdialog] #iconContainer {
   display: none;
 }

toolkit/components/prompts/content/commonDialog.xhtml

@@ -54,9 +54,7 @@
     </menupopup>
   </popupset>
 
-  <!-- The <div> was added in bug 1606617 to workaround bug 1614447 -->
-  <div xmlns="http://www.w3.org/1999/xhtml">
-    <div id="dialogGrid">
+  <div xmlns="http://www.w3.org/1999/xhtml" id="dialogGrid">
     <div class="dialogRow" id="infoRow" hidden="hidden">
       <div id="iconContainer">
         <xul:image id="infoIcon"/>
@@ -79,6 +77,5 @@
       <xul:checkbox id="checkbox" oncommand="Dialog.onCheckbox()"/>
     </div>
   </div>
-  </div>
 </dialog>
 </window>

toolkit/content/resetProfile.xhtml

@@ -25,9 +25,7 @@
     <html:link rel="localization" href="toolkit/global/resetProfile.ftl"/>
   </linkset>
 
-  <!-- The <div> was added in bug 1606617 to workaround bug 1614447 -->
-  <div xmlns="http://www.w3.org/1999/xhtml">
-    <div id="dialogGrid">
+  <div xmlns="http://www.w3.org/1999/xhtml" id="dialogGrid">
     <div class="dialogRow" id="infoRow">
       <div id="iconContainer">
         <xul:image id="infoIcon"/>
@@ -39,7 +37,6 @@
       </div>
     </div>
   </div>
-  </div>
 
   <script src="chrome://global/content/resetProfile.js"/>
 </dialog>