Parcourir la source

last post responsive #472

ali il y a 1 an
Parent
commit
d20916b1fa
1 fichiers modifiés avec 33 ajouts et 0 suppressions
  1. 33 0
      src/components/Widgets/Post/LastPosts/components/PostItem.vue

+ 33 - 0
src/components/Widgets/Post/LastPosts/components/PostItem.vue

@@ -109,5 +109,38 @@ export default defineComponent({
       }
     }
   }
+  @media screen and (max-width: 1024px) {
+    & {
+      flex-flow: column;
+      .thumbnail {
+        order: 1;
+        width: 100%;
+        margin-bottom: 8px;
+        .q-img {
+          border-radius: 8px;
+        }
+      }
+      .content {
+        order: 2;
+        width: 100%;
+        padding: 24px !important;
+      }
+    }
+  }
+  @media screen and (max-width: 600px) {
+    & {
+      .content {
+        .meta-and-action {
+          flex-flow: column;
+          justify-content: space-between;
+          align-items: flex-start;
+          gap: 8px;
+          .q-btn {
+            width: 100%;
+          }
+        }
+      }
+    }
+  }
 }
 </style>