add smooth scrolling, back to top button and update copyright and cop…

…yright year in footer

css/main.css

@@ -210,6 +210,12 @@ textarea {
     text-align: left;
   }
 
+  @media (prefers-reduced-motion: no-preference) {
+    html {
+        scroll-behavior: smooth;  
+    }
+}
+
   /* Setting margins to zero to remove all browser default margins */
 
   h1,
@@ -337,6 +343,27 @@ textarea {
     width: 100%;
   }
 
+  #backToTopBtn {
+    display: none;
+    position: fixed;
+    bottom: 20px;
+    right: 30px;
+    z-index: 99;
+    font-size: 18px;
+    border: none;
+    outline: none;
+    background-color: #f4bedc; 
+    color: #351d77;
+    cursor: pointer;
+    padding: 15px;
+    border-radius: 4px;
+  }
+
+  #backToTopBtn:hover {
+    background-color: #eC91c4;
+    color: white;
+  }
+
   /* -----Mobile Styles ----- */
 
   /* Portfolio */

index.html

@@ -41,6 +41,7 @@
       <h1><i class="fa-solid fa-code" style="color: #351d77;"></i> Hi! I'm Shanna Walsh!</h1>
       <h2>I'm a Full Stack Developer and Air Force veteran with an insatiable curiosity for understanding how things work.</h2>
       </div>
+      <button onclick="topFunction()" id="backToTopBtn" title="Go to top">Top</button>
   </div>
   </header>
   <main>
@@ -188,11 +189,11 @@ <h4 class="contact-title">Meet me</h4>
           <p>Let's chat code and have a cup of coffee or meet on zoom!</p>
         </div>
       </div>
-      <p>Copyright <script>document.write(new Date().getFullYear())</script> | Shanna Walsh</p>
+      <p>&copy; <span id="currentYear"></span> | Shanna Walsh</p>
     </div>
   </footer>
 
-
+  <script src="js/script.js"></script>
 </body>
 
 </html>

js/script.js

@@ -0,0 +1,30 @@
+// Select the button:
+const backToTopButton = document.getElementById("backToTopBtn");
+
+// When the user scrolls down 20px from the top of the document, show the button
+window.onscroll = function() {scrollFunction()};
+
+function scrollFunction() {
+  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+    backToTopButton.style.display = "block";
+  } else {
+    backToTopButton.style.display = "none";
+  }
+}
+
+// When the user clicks on the button, scroll to the top of the document
+function topFunction() {
+  document.body.scrollTop = 0; // For Safari
+  document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
+}
+
+// Select the Copyright element:
+let currentYearElement = document.getElementById("currentYear");
+
+// Get the current year
+//let currentDate = new Date();
+let currentYear = (new Date().getFullYear());
+
+// Update the date in the Copyright element
+currentYearElement.innerText = currentYear;
+