Make illustrations to scale down if they are too large

Bug: 1007180
Change-Id: I791e11308f6febc6cf3f73bb8c723341e0adee3e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1821523Reviewed-by: Roman Sorokin [CET] <rsorokin@chromium.org>
Commit-Queue: Denis Kuznetsov <antrim@chromium.org>
Cr-Commit-Position: refs/heads/master@{#700301}

chrome/browser/resources/chromeos/login/enterprise_enrollment.html

@@ -116,7 +116,8 @@
           <div slot="footer" class="flex layout vertical center end-justified">
             <img srcset="images/enrollment_success_illustration_1x.png 1x,
                     images/enrollment_success_illustration_2x.png 2x"
-                 i18n-values="alt:enrollmentSuccessIllustrationTitle">
+                 i18n-values="alt:enrollmentSuccessIllustrationTitle"
+                 class="oobe-illustration">
           </div>
           <div slot="bottom-buttons" class="layout horizontal end-justified">
             <oobe-text-button inverse id="success-done-button"

chrome/browser/resources/chromeos/login/oobe_flex_layout.css

@@ -112,3 +112,9 @@
   right: 0;
   top: 0;
 }
+
+.oobe-illustration {
+  max-height: -webkit-fill-available;
+  max-width: -webkit-fill-available;
+  object-fit: contain;
+}

chrome/browser/resources/chromeos/login/oobe_reset.html

@@ -74,7 +74,8 @@
       <div slot="footer" class="flex layout vertical center">
         <img id="illustration" srcset="images/1x/reset_illustration_1x.svg 1x,
                                        images/2x/reset_illustration_2x.svg 2x"
-            i18n-values="alt:resetScreenIllustrationTitle">
+            i18n-values="alt:resetScreenIllustrationTitle"
+            class="oobe-illustration">
         <div id="tpmFirmwareUpdate" class="layout horizontal"
             hidden="[[!tpmFirmwareUpdateAvailable_]]">
           <cr-checkbox id="tpmFirmwareUpdateCheckbox"

chrome/browser/resources/chromeos/login/oobe_screen_reset.css

@@ -4,9 +4,7 @@
 
 #reset {
   display: flex;
-  flex-flow: column;
   font-size: 16px;
   min-height: 0;
   text-align: start;
-  width: 768px;
 }