fix dialogs width when scaling up the UI

Alberto Iannaccone · Alberto Iannaccone · commit 874f0f1a4974 · 2022-08-09T09:18:50.000+02:00
diff --git a/arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-uploader-dialog.tsx b/arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-uploader-dialog.tsx
@@ -1,5 +1,9 @@
 import * as React from '@theia/core/shared/react';
-import { inject, injectable, postConstruct } from '@theia/core/shared/inversify';
+import {
+  inject,
+  injectable,
+  postConstruct,
+} from '@theia/core/shared/inversify';
 import { DialogProps } from '@theia/core/lib/browser/dialogs';
 import { AbstractDialog } from '../../theia/dialogs/dialogs';
 import { Widget } from '@theia/core/shared/@phosphor/widgets';
@@ -147,6 +151,7 @@ export class UploadCertificateDialog extends AbstractDialog<void> {
         'Upload SSL Root Certificates'
       ),
     });
+    this.node.id = 'certificate-uploader-dialog-container';
     this.contentNode.classList.add('certificate-uploader-dialog');
     this.acceptButton = undefined;
   }
diff --git a/arduino-ide-extension/src/browser/dialogs/firmware-uploader/firmware-uploader-dialog.tsx b/arduino-ide-extension/src/browser/dialogs/firmware-uploader/firmware-uploader-dialog.tsx
@@ -101,6 +101,7 @@ export class UploadFirmwareDialog extends AbstractDialog<void> {
     protected override readonly props: UploadFirmwareDialogProps
   ) {
     super({ title: UploadFirmware.Commands.OPEN.label || '' });
+    this.node.id = 'firmware-uploader-dialog-container';
     this.contentNode.classList.add('firmware-uploader-dialog');
     this.acceptButton = undefined;
   }
diff --git a/arduino-ide-extension/src/browser/dialogs/ide-updater/ide-updater-dialog.tsx b/arduino-ide-extension/src/browser/dialogs/ide-updater/ide-updater-dialog.tsx
@@ -130,6 +130,7 @@ export class IDEUpdaterDialog extends AbstractDialog<UpdateInfo> {
         'Software Update'
       ),
     });
+    this.node.id = 'ide-updater-dialog-container';
     this.contentNode.classList.add('ide-updater-dialog');
     this.acceptButton = undefined;
   }
diff --git a/arduino-ide-extension/src/browser/style/certificate-uploader-dialog.css b/arduino-ide-extension/src/browser/style/certificate-uploader-dialog.css
@@ -1,4 +1,4 @@
-.certificate-uploader-dialog {
+#certificate-uploader-dialog-container > .dialogBlock {
   width: 600px;
 }
 
diff --git a/arduino-ide-extension/src/browser/style/firmware-uploader-dialog.css b/arduino-ide-extension/src/browser/style/firmware-uploader-dialog.css
@@ -1,4 +1,4 @@
-.firmware-uploader-dialog {
+#firmware-uploader-dialog-container > .dialogBlock {
   width: 600px;
 }
 
@@ -11,7 +11,6 @@
 }
 
 .firmware-uploader-dialog .dialogRow > button{
-  width: 33%;
   margin-right: 3px;
 }
 
diff --git a/arduino-ide-extension/src/browser/style/ide-updater-dialog.css b/arduino-ide-extension/src/browser/style/ide-updater-dialog.css
@@ -1,4 +1,4 @@
-.ide-updater-dialog {
+#ide-updater-dialog-container > .dialogBlock {
   width: 546px;
 }
 
@@ -24,6 +24,8 @@
   .ide-updater-dialog--content
   .ide-updater-dialog--new-version-text.dialogSection {
   margin-top: 0;
+  flex: 1;
+  min-width: 0;
 }
 
 .ide-updater-dialog .changelog-container {

Original file line number	Diff line number	Diff line change
`@@ -101,6 +101,7 @@ export class UploadFirmwareDialog extends AbstractDialog<void> {`
`101`	`101`	`protected override readonly props: UploadFirmwareDialogProps`
`102`	`102`	`) {`
`103`	`103`	`super({ title: UploadFirmware.Commands.OPEN.label \|\| '' });`
	`104`	`+ this.node.id = 'firmware-uploader-dialog-container';`
`104`	`105`	`this.contentNode.classList.add('firmware-uploader-dialog');`
`105`	`106`	`this.acceptButton = undefined;`
`106`	`107`	`}`
Original file line number	Diff line number	Diff line change
`@@ -130,6 +130,7 @@ export class IDEUpdaterDialog extends AbstractDialog<UpdateInfo> {`
`130`	`130`	`'Software Update'`
`131`	`131`	`),`
`132`	`132`	`});`
	`133`	`+ this.node.id = 'ide-updater-dialog-container';`
`133`	`134`	`this.contentNode.classList.add('ide-updater-dialog');`
`134`	`135`	`this.acceptButton = undefined;`
`135`	`136`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.certificate-uploader-dialog {`
	`1`	`+#certificate-uploader-dialog-container > .dialogBlock {`
`2`	`2`	`width: 600px;`
`3`	`3`	`}`
`4`	`4`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.firmware-uploader-dialog {`
	`1`	`+#firmware-uploader-dialog-container > .dialogBlock {`
`2`	`2`	`width: 600px;`
`3`	`3`	`}`
`4`	`4`
`@@ -11,7 +11,6 @@`
`11`	`11`	`}`
`12`	`12`
`13`	`13`	`.firmware-uploader-dialog .dialogRow > button{`
`14`		`- width: 33%;`
`15`	`14`	`margin-right: 3px;`
`16`	`15`	`}`
`17`	`16`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.ide-updater-dialog {`
	`1`	`+#ide-updater-dialog-container > .dialogBlock {`
`2`	`2`	`width: 546px;`
`3`	`3`	`}`
`4`	`4`
`@@ -24,6 +24,8 @@`
`24`	`24`	`.ide-updater-dialog--content`
`25`	`25`	`.ide-updater-dialog--new-version-text.dialogSection {`
`26`	`26`	`margin-top: 0;`
	`27`	`+ flex: 1;`
	`28`	`+ min-width: 0;`
`27`	`29`	`}`
`28`	`30`
`29`	`31`	`.ide-updater-dialog .changelog-container {`