From ccc0a0729a8386563802f6692e19fe11c029ea4c Mon Sep 17 00:00:00 2001
From: Joshua Ashton <joshuatashton+dev@gmail.com>
Date: Wed, 8 Jan 2025 09:32:42 -0700
Subject: [PATCH] implementing suggestions from user.

---
 src/Projects.jsx | 10 +++++-----
 src/main.css     | 24 +++++++++++++++++++-----
 2 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/src/Projects.jsx b/src/Projects.jsx
index 7bc92314..5df1c78a 100644
--- a/src/Projects.jsx
+++ b/src/Projects.jsx
@@ -28,15 +28,15 @@ export default function Projects({ cardData }) {
           <div id="projects-header-row">
             <h1>Projects</h1>
             <div id="projects-nav-buttons">
-              <div className="slider-nav-button shadow tooltip" onClick={prevSlide}>
-                <span className="material-icons">
+              <div className="slider-nav-button tooltip" onClick={prevSlide}>
+                <span className="material-icons project-nav-icon">
                   chevron_left
                 </span>
                 <span className="tooltip-text">Previous Project</span>
               </div>
 
-              <div className="slider-nav-button shadow tooltip" onClick={nextSlide}>
-                <span className="material-icons">
+              <div className="slider-nav-button tooltip" onClick={nextSlide}>
+                <span className="material-icons project-nav-icon">
                   chevron_right
                 </span>
                 <span className="tooltip-text">Next Project</span>
@@ -46,7 +46,7 @@ export default function Projects({ cardData }) {
           <Swiper
             modules={[Navigation, Scrollbar]}
             navigation
-            slidesPerView={1.2}
+            slidesPerView={1}
             loop={false}
             id="project-cards-section"
             className="mySwiper"
diff --git a/src/main.css b/src/main.css
index cd502949..d8f2ee6c 100644
--- a/src/main.css
+++ b/src/main.css
@@ -321,19 +321,21 @@ p {
 
 #projects-header-row {
   display: flex;
+  align-items: top;
 }
 
 #projects-nav-buttons {
+  margin-top: 1.5vw;
   display: flex;
   flex-direction: row;
-  align-items: center;
-  justify-content: right;
+  align-items: bottom;
+  justify-content: left;
   width: 100%;
-  margin-right: 5vw;
 }
 
 .slider-nav-button {
-  margin: 2vw;
+  margin-left: 2vw;
+  margin-right: 2vw;
   transition-duration: 500ms;
 }
 
@@ -873,8 +875,20 @@ p {
     border-radius: 10px;
   }
 
+  #projects-header-row h1 {
+    margin-top: .2vw;
+  }
+
   #projects-nav-buttons {
-    visibility: hidden;
+    margin-top: 0;
+  }
+
+  .slider-nav-button {
+    height: max-content;
+  }
+
+  .project-nav-icon {
+    font-size: clamp(2rem, 3rem, 4rem);
   }
 }