Fixed Copy Paste CSS issues

newfold-labs · Dec 13, 2022 · dbb24ca · dbb24ca
1 parent 7ba163f
commit dbb24ca
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/stylesheet.scss b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/stylesheet.scss
@@ -77,18 +77,19 @@
     padding-right: 10px;
     font-size:  clamp(0.88rem, 0.45rem + 0.76vw, 1.13rem);
     line-height: 1.6;
-    width: 390px;
 }
+
 .tab-img {
     background-color: var(--nfd-onboarding-tertiary);
     overflow: hidden;
 }
+
 .tab-img-base {
     background-size: contain;
     background-repeat: no-repeat;
-    width: 400px;
     height: 228px;
     animation-duration: 360ms;
+    width: clamp(180px, 50vw, 400px);
     animation-timing-function: ease-out;
     @media (prefers-reduced-motion) {
         animation: none !important;
@@ -119,7 +120,7 @@
     flex-direction: column;
     align-items: center;
     justify-content: space-around;
-    height: clamp(520px, 59vh, 800px);
+    height: clamp(560px, 59vh, 800px);
     width: 100%;
     padding-bottom: 10px;
 }
@@ -139,6 +140,5 @@
 
     .content-img, .design-img, .features-img {
         max-height: 100px;
-        max-width: 180px;
     }
 }
diff --git a/src/OnboardingSPA/pages/Steps/WhatNext/stylesheet.scss b/src/OnboardingSPA/pages/Steps/WhatNext/stylesheet.scss
@@ -79,7 +79,6 @@
     padding-right: 10px;
     font-size:  clamp(0.88rem, 0.45rem + 0.76vw, 1.13rem);
     line-height: 1.6;
-    width: 390px;
 }
 
 .content-image {
@@ -90,9 +89,9 @@
 .whatsnext-image {
     background-size: contain;
     background-repeat: no-repeat;
-    width: 400px;
     height: 228px;
     animation-duration: 360ms;
+    width: clamp(180px, 50vw, 400px);
     animation-timing-function: ease-out;
     @media (prefers-reduced-motion) {
         animation: none !important;
@@ -123,7 +122,7 @@
     flex-direction: column;
     align-items: center;
     justify-content: space-around;
-    height: clamp(520px, 59vh, 800px) !important;
+    height: clamp(600px, 59vh, 800px) !important;
     width: 100%;
     padding-bottom: 10px;
 }
@@ -141,8 +140,7 @@
         min-height: 10px;
     }
 
-    .content-img, .design-img, .features-img {
+    .wpadmin-img, .help-img, .bluesky-img {
         max-height: 100px;
-        max-width: 180px;
     }
 }