Update portfolio page

Author: alissatroiano

assets/css/projects.css

@@ -359,6 +359,11 @@ ul#nav {
 	transform: translate(-50%, -50%) scale(1);
 }
 
+hr {
+  border: 1px solid var(--violet);
+  width: 75%;
+  opacity: 1;
+}
 
 a.nav-link,
 #navbarCollapse,
@@ -396,14 +401,15 @@ nav.navbar {
 }
 
 #gallery {
-  padding: 30px;
+  padding: 60px;
   margin-top: 30px;
 }
 
 .gallery .gallery-item {
   position: relative;
   overflow: hidden;
   border-radius: 10px;
+  box-shadow: rgba(160, 117, 245, 0.4) 0px 2px 4px, rgba(160, 117, 245, 0.3) 0px 7px 13px -3px, rgba(106, 22, 232, 0.2) 0px -3px 0px inset;
 }
 
 img.gallery-item {
@@ -464,16 +470,25 @@ img.gallery-item {
   margin: 0;
 }
 
-
-
 #projectModal1 {
   min-width: 100vw;
 }
 
-/* 
-section#projects {
-  background: #f7f7f7;
-} */
+p.tech-stack {
+  font-size: 14px;
+}
+
+#btn-back-to-top {
+  position: fixed;
+  bottom:80px;
+  right: 20px;
+  color: #6d62ff;
+}
+
+#btn-back-to-top:hover {
+  position: fixed;
+  color: #6c62ffc1;
+}
 
 .modal-dialog.modal-dialog-centered.modal-dialog-scrollable.w-100,
 .modal-dialog-scrollable .modal-content {

assets/css/style.css

@@ -561,7 +561,7 @@ section#cta1 {
 
 section#cta2 {
   min-height: 30vh;
-  background-color: #fafafa;
+  background-color: rgb(219, 207, 243);
 
 }
 
@@ -577,18 +577,17 @@ a.data {
 }
 
 a.data:hover {
-  text-shadow: -1px -1px 2px var(--dark-violet),
-  1px 1px 2px var(--dark-violet),
-  0px 0px 18px var(--dark-violet),
-   0px 0px 38px var(--dark-violet);
+  text-shadow: 0px 15px 5px rgba(0,0,0,0.1),
+  10px 20px 5px rgba(0,0,0,0.05),
+  -10px 20px 5px rgba(0,0,0,0.05);
   border: none;
   color: var(--violet);
 }
 
 a.data-2:hover {
   color: var(--violet);
-  text-shadow: 2px 7px 5px rgba(0,0,0,0.3), 
-  0px -4px 10px rgba(255,255,255,0.3);
+	
+  text-shadow: 0px 0px 6px rgba(255,255,255,0.7);
 }
 
 a.data-2:before,
@@ -963,6 +962,10 @@ form {
   margin-top: 20px;
 }
 
+input#button {
+  background: #0c010175;
+}
+
 #ringForm {
   padding: 40px;
 }

assets/js/top.js

@@ -1,16 +1,14 @@
 //Get the button
 let mybutton = document.getElementById("btn-back-to-top");
 
-// 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 > 250 ||
-    document.documentElement.scrollTop > 250
+    document.body.scrollTop > 20 ||
+    document.documentElement.scrollTop > 20
   ) {
     mybutton.style.display = "block";
   } else {

index.html

@@ -522,7 +522,7 @@ <h2 class="display-2 my-5 title ms-sm-4 ms-lg-5">My Stack</h2>
   <section class="container my-0 mx-auto" id="contact">
     <div class="row d-flex my-0 mx-auto text-center align-items-center justify-content-center">
       <div class="col-12 mt-5 pt-5">
-        <div class="contact-form-wrapper">
+        <div class="contact-form-wrapper mt-4">
           <h2 class="section-title text-center display-6 my-3 my-md-4" data-aos="fade-in" data-aos-delay="200"
           data-aos-duration="1200" id="contactMe">Contact Me</h2>
           <form method="POST" id="contact-form" action="submit">