Merge pull request #166 from uclaacm/fix-card-overflow

fixed archive card overflow overflow
uclaacm · Apr 22, 2024 · 4ea34ee · 4ea34ee
2 parents 3d686d7 + 3d3f0b8
commit 4ea34ee
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 4 deletions.
diff --git a/styles/Archive.module.scss b/styles/Archive.module.scss
@@ -18,7 +18,7 @@
   border: var(--cyber-gold) 2px solid;
   border-radius: 2rem;
   width: 20rem;
-  height: 15rem;
+  height: 17rem;
   text-align: left;
 
   &:hover {
@@ -28,8 +28,10 @@
 }
 
 .eventContent {
-  display: block;
+  display: flex;
   width: 100%;
+  flex-direction: column;
+  height: 100%;
 }
 
 .graphic {
@@ -54,11 +56,12 @@
   font-size: 1rem;
   color: var(--organic-oranges);
   margin: 0rem 1rem 0.7rem 1rem;
+  flex-grow: 1;
 }
 
 .links {
   vertical-align: top;
-  margin: 0rem 1.5rem 0.7rem 1rem;
+  margin: 0rem 1.5rem 0.85rem 1.5rem;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;

diff --git a/styles/Events.module.scss b/styles/Events.module.scss
@@ -56,6 +56,7 @@
   width: 20rem;
   position: relative;
   transition: box-shadow 0.2s;
+  height: 23rem;
 }
 
 @media screen and (max-width: 600px) {
@@ -79,7 +80,6 @@
   border-top-left-radius: var(--border-radius);
   border-top-right-radius: var(--border-radius);
   width: 100%;
-  flex: 1;
 }
 
 .event-card .details {
@@ -89,6 +89,10 @@
   padding-bottom: calc(0.5 * var(--border-radius));
   border-bottom-left-radius: var(--border-radius);
   border-bottom-right-radius: var(--border-radius);
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-evenly;
 }
 
 .upcoming .event-card .details {