chore(posts): Enhancement mobile css

1ilsang · May 13, 2024 · 12585ae · 12585ae
1 parent a2e9b65
commit 12585ae
Showing 1 changed file with 15 additions and 4 deletions.
diff --git a/src/features/styles/ui/posts/posts.scss b/src/features/styles/ui/posts/posts.scss
@@ -77,6 +77,10 @@
       background-size: 400% 400%;
       animation: water-rainbow 5s ease infinite;
 
+      @include mobile {
+        border-radius: 40px 80px / 80px 15px;
+      }
+
       .post-description,
       .date-format {
         color: white;
@@ -86,6 +90,11 @@
     .link {
       display: flex;
 
+      @include mobile {
+        flex-direction: column;
+        align-items: center;
+      }
+
       .cover {
         animation: skeleton-gradient 1.8s infinite ease-in-out;
         border-radius: 4px;
@@ -95,10 +104,16 @@
         height: 112.5px;
         object-fit: cover;
         margin-right: 1.5rem;
+
+        @include mobile {
+          width: 250px;
+          height: 130px;
+        }
       }
 
       .content {
         margin-top: 0.5rem;
+        width: 100%;
 
         .title {
           font-size: 1.5rem;
@@ -111,10 +126,6 @@
           margin-bottom: 0.3rem;
         }
       }
-
-      @include mobile {
-        flex-direction: column;
-      }
     }
   }