Fixed the merge, added Liam's code back in

Dude its done now
cse110-sp24-group31 · Jun 5, 2024 · 0aa4c88 · 0aa4c88
1 parent 832b56f
commit 0aa4c88
Showing 1 changed file with 27 additions and 30 deletions.
diff --git a/assets/scripts/ProjectCard.js b/assets/scripts/ProjectCard.js
@@ -32,25 +32,29 @@ class ProjectCard extends HTMLElement {
           width: 320px;
           filter: drop-shadow(0px 10px 10px rgb(0, 0, 0, 0.4));
           padding: 10px 20px;
+          transition: transform 0.2s ease, box-shadow 0.2s ease;
         }
 
-        .project-card .name {
-          color: rgb(0, 0, 0);
-          font-size: 1.8em;
-          font-weight: bold;
+        .project-card:hover {
+          transform: translateY(-5px);
+          box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
         }
 
-        .project-card .name:hover {
+        .project-card .name {
+          color: rgb(0, 0, 0);
           font-size: 2em;
-          margin: 0;
-          white-space: wrap;
-          overflow: auto;
-          text-overflow: unset;
-          transition: 0.1s ease all;
+          font-weight: bold;
+          display: block;
+          white-space: nowrap;
+          overflow-x: auto;
         }
 
-        .project-card img {
-          width = 100px;
+        .project-card .project-image {
+          align-self: center;
+          justify-self: center;
+          object-fit: fill;
+          height: 100%;
+          width: 100%;
         }
 
         .project-card button {
@@ -62,7 +66,7 @@ class ProjectCard extends HTMLElement {
           height: auto;
           max-height: 50px;
           padding: 8px 20px;
-          transition: 0.1s ease all;
+          transition: background-color 0.1s ease;
           margin-right: 5px;
           margin-bottom: 2px;
         }
@@ -73,23 +77,6 @@ class ProjectCard extends HTMLElement {
           transition: 0.1s ease all;
         }
 
-        .project-card .project-image {
-          align-self: center;
-          justify-self: center;
-          object-fit: fill;
-          height: 100%;
-          width: 100%;
-        }
-        .project-card .progress-bar {
-          position: relative;
-          width: 320px;
-          height: 20px;
-          background-image: url('assets/images/SpaceBackground_Pixelart.png');
-          background-size: 100% cover;
-          background-position: center;
-          background-repeat: no-repeat;
-        }
-
         .project-card .desc {
           width: 90%;
           height: 80%;
@@ -103,6 +90,16 @@ class ProjectCard extends HTMLElement {
           border-radius: 5% 5% 5% 5%;
           background-color: rgba(0, 0, 0, 0.164);
         }
+        .project-card .progress-bar {
+          position: relative;
+          width: 320px;
+          height: 20px;
+          background-image: url('assets/images/SpaceBackground_Pixelart.png');
+          background-size: 100% cover;
+          background-position: center;
+          background-repeat: no-repeat;
+        }
+
         .progress-bar > .progress-bar-fill {
           position: absolute;
           height: 20px;