[DDW-751] Fix issues related to minimum screen size (#2719)

* [DDW-751] Fix scroll in initial settings page

* [DDW-751] Fix App Update Overlay height

* [DDW-751] Alphabetize css properties

* [DDW-751] Update CHANGELOG

* [DDW-754] Vertically aligned initial settings page

Author: mchappell

CHANGELOG.md

@@ -9,6 +9,7 @@
 
 ### Fixes
 
+- Fixed issues relating to minimum window size in Daedalus ([PR 2719](https://github.com/input-output-hk/daedalus/pull/2719))
 - Updated "Trezor T" image shown on the "Pair a hardware wallet device" dialog ([PR 2712](https://github.com/input-output-hk/daedalus/pull/2712))
 - Fixed transaction timestamps localization ([PR 2702](https://github.com/input-output-hk/daedalus/pull/2702))
 

source/renderer/app/components/appUpdate/AppUpdateOverlay.scss

@@ -10,6 +10,7 @@
   font-family: var(--font-regular);
   height: 100vh;
   justify-content: center;
+  padding: 20px 0;
   position: fixed;
   top: 0;
   width: 100vw;
@@ -21,7 +22,8 @@
     font-size: 16px;
     line-height: 1.2;
     margin-bottom: 20px;
-    max-height: 464px;
+    max-height: 210px;
+    min-height: 48px;
     opacity: 0.8;
     overflow-y: scroll;
     padding: 12px 20px;

source/renderer/app/components/layout/TopBarLayout.scss

@@ -19,5 +19,9 @@ $topBarHeight: 84px;
 }
 
 .content {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
   height: calc(100% - #{$topBarHeight});
+  overflow-y: overlay;
 }

source/renderer/app/components/profile/initial-settings/InitialSettings.scss

@@ -1,17 +1,25 @@
 @import '../../../themes/mixins/error-message';
 
 .component {
-  align-items: center;
+  align-self: center;
   display: flex;
-  height: 100%;
-  justify-content: center;
+  flex: 1;
+  flex-direction: column;
+  justify-self: center;
+}
+
+.component::before,
+.component::after {
+  content: '';
+  display: block;
+  flex: 1;
+  min-height: 20px;
 }
 
 .centeredBox {
   background-color: var(--theme-bordered-box-background-color);
   border: var(--theme-bordered-box-border);
   border-radius: 4px;
-  overflow: visible;
   padding: 30px 30px 20px;
   width: 620px;
 }