add button to signify horizontal scroll

src/components/ImageSwiper/ImageSwiper.js

@@ -19,6 +19,7 @@ export default function ImageSwiper({ images }) {
             { images.map( image => (
                 <SwiperSlide className='swiper-slide'>
                     <img className='store-item-image' src={ image } alt='cool shirt brah' />
+                    <button className='next-button'>></button>
                 </SwiperSlide>
             ))}
         </Swiper>

src/components/Pages/About/About.css

@@ -49,4 +49,5 @@
     display: flex;
     flex-direction: column;
     padding:  10px 10%;
+    align-items: center;
 }

src/components/Pages/Contact/Contact.js

@@ -4,7 +4,7 @@ import './Contact.css';
 export default function Contact() {
     return (
         <div className="contact-wrapper">
-            CONTACT
+            MaldeveraTX@gmail.com
         </div>
     )
 }

src/components/Pages/Merch/StoreItem/StoreItem.css

@@ -13,6 +13,8 @@
 
     height: 400px;
     width: 400px;
+
+    position: relative;
 }
 
 .store-item-info {
@@ -33,4 +35,22 @@
 .store-item-purchase-button:hover {
     cursor: pointer;
     background-color: orange;
-}
+}
+
+
+
+.next-button {
+    position: absolute;
+    top: 50%;
+    right: 10px;
+    border-radius: 40px;
+}
+
+
+
+/* to place a button over an image
+( to signify horizontal scrolling ),
+make the image position: relative,
+and the button position: absolute,
+with top: 10px, left: 10px, etc
+to position the button over the image */

src/components/Pages/Shows/Shows.js

@@ -4,7 +4,7 @@ import './Shows.css';
 export default function Shows() {
     return (
         <div className="shows-wrapper">
-            SHOWS
+            2024 Dates Coming Soon..
         </div>
     )
 }