Update hero

pizza-to-the-polls · Dec 14, 2023 · 2aa1240 · 2aa1240
1 parent 5fc61a0
commit 2aa1240
Show file tree

Hide file tree

Showing 9 changed files with 19 additions and 11 deletions.
diff --git a/public/images/basil.png b/public/images/basil.png
diff --git a/public/images/pics/photo_8.jpg b/public/images/pics/photo_8.jpg
diff --git a/public/images/pics/photo_9.jpg b/public/images/pics/photo_9.jpg
diff --git a/public/images/redpepper.png b/public/images/redpepper.png
diff --git a/src/components/app-root/app-root.scss b/src/components/app-root/app-root.scss
@@ -69,7 +69,7 @@
   box-shadow: $box-shadow;
 
   height: 120px;
-  min-width: 350px;
+  min-width: 400px;
 
   @media ($tablet) {
     border-bottom: none;

diff --git a/src/components/app-root/css/_base.scss b/src/components/app-root/css/_base.scss
@@ -7,7 +7,7 @@ html {
   font-size: 16px;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
-  min-width: 300px;
+  min-width: 400px;
   overflow-x: hidden;
   overflow-y: scroll;
   text-rendering: optimizeLegibility;

diff --git a/src/components/form-report/form-report.scss b/src/components/form-report/form-report.scss
@@ -18,7 +18,7 @@ form-report {
         display: flex;
         justify-content: space-around;
         max-width: 80%;
-        min-width: 300px;
+        min-width: 420px;
         label {
           border: 1px solid $teal;
           width: 6rem;

diff --git a/src/components/page-home/page-home.scss b/src/components/page-home/page-home.scss
@@ -13,8 +13,8 @@ page-home {
     color: $white;
     padding: 40px 0;
 
-    @media ($tablet) {
-      padding: 80px 0;
+    .button + .button {
+      margin-left: 1rem;
     }
 
     .container {
@@ -34,10 +34,14 @@ page-home {
         text-transform: uppercase;
         margin: 0 0 1rem 0;
 
-        @media ($tablet) {
+        @media ($widescreen) {
           font-size: 6rem;
           line-height: 5.5rem;
-          margin: 0 0 2rem 0;
+        }
+        @media ($desktop) {
+          font-size: 4.8rem;
+          line-height: 4rem;
+          margin: 0 0 1rem 0;
         }
       }
 
@@ -46,12 +50,14 @@ page-home {
         line-height: 1.5rem;
         font-weight: 600;
         margin-bottom: 1.5rem;
-
         @media ($tablet) {
           font-size: 1.5rem;
           line-height: 2rem;
           margin-bottom: 2rem;
         }
+        @media ($desktop) {
+          margin-bottom: 1rem;
+        }
       }
 
       .button-group {
@@ -64,8 +70,11 @@ page-home {
     }
 
     img {
+      border-radius: $radius;
+      max-height: 400px;
       @media ($desktop) {
         max-width: 90%;
+        max-height: unset;
         float: right;
       }
     }
@@ -83,7 +92,7 @@ page-home {
 
         @media ($under-tablet) {
           height: 1rem;
-          font-size: 1rem;
+          font-size: 0.9rem;
         }
 
         font-weight: 700;

diff --git a/src/components/page-home/page-home.tsx b/src/components/page-home/page-home.tsx
@@ -43,15 +43,14 @@ export class PageHome {
                 <stencil-route-link class="button button-large is-cyan" url="/donate">
                   Donate now
                 </stencil-route-link>
-                &nbsp;
                 <stencil-route-link class="button button-large is-teal" url="/crustclub">
                   Join the Crust Club
                 </stencil-route-link>
                 <span class="donate-button-subtext">* All contributions are tax deductible</span>
               </div>
             </div>
             <div>
-              <img src="/images/hero.png" alt="collage of pepperoni pizza, pizza ingredients and a pizza to the polls volunteer" />
+              <img class="inset" src="/images/pics/photo_9.jpg" alt="" />
             </div>
           </div>
         </div>