feat: adjust photo placement when screen not wide enough

iamogbz · Jan 17, 2024 · 9b7a500 · 9b7a500
1 parent ffa3680
commit 9b7a500
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/src/components/PoemCard.css b/src/components/PoemCard.css
@@ -54,6 +54,11 @@
   gap: 4px;
   background-color: transparent;
   border-radius: 4px;
+  position: relative;
+
+  @media (max-width:640px) {
+    flex-direction: column;
+  }
 }
 
 .poem-card-details .poem-card-content {
@@ -92,6 +97,10 @@
 
   transition: height 0.3s ease-in-out, width 0.3s ease-in-out;
 
+  @media (max-width:640px) {
+    width: 100%;
+  }
+
   &::before {
     content: '';