Image Optimized for Cowsit

HackDavis · Mar 12, 2024 · 878d4fd · 878d4fd
1 parent 91214d2
commit 878d4fd
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/app/(pages)/(index-page)/_components/RiverCow/RightTree.tsx b/app/(pages)/(index-page)/_components/RiverCow/RightTree.tsx
@@ -13,18 +13,21 @@ export default function RightTree() {
         alt="Tree hanging over river."
         placeholder="blur"
         className={styles.right_tree}
+        sizes="(min-width: 600px) 40vw, 215px"
       />
       <Image
         src={rightTreeShadow}
         alt="Tree hanging over river."
         placeholder="blur"
         className={styles.right_tree_shadow}
+        sizes="(min-width: 600px) 40vw, 215px"
       />
       <Image
         src={rightTreeReflection}
         alt="Tree hanging over river."
         placeholder="blur"
         className={styles.right_tree_reflection}
+        sizes="(min-width: 600px) 40vw, 215px"
       />
     </div>
   );

diff --git a/app/(pages)/(index-page)/_components/RiverCow/RiverCow.tsx b/app/(pages)/(index-page)/_components/RiverCow/RiverCow.tsx
@@ -27,6 +27,7 @@ export default function RiverCow() {
           alt="Cow sitting on rock reminiscing on past adventures by looking at polaroids."
           placeholder="blur"
           className={styles.river_cow}
+          sizes="(min-width: 780px) 600px, 300px"
         />
       </div>
       <div className={styles.bottom_text}>
@@ -50,7 +51,7 @@ export default function RiverCow() {
           src={baseTree}
           alt="Forest of trees sitting at base of river, forming a wall."
           placeholder="blur"
-          sizes="(min-width: 1080px) 100vw, 996px"
+          sizes="100vw"
           className={styles.base_tree}
         />
       </div>