improve postCard & postPage for mobile

packages/app/src/pages/post/[post_id].mobile.jsx

@@ -3,9 +3,12 @@ import * as antd from "antd"
 
 import Post from "models/post"
 import { PostCard, CommentsCard } from "components"
+import { FloatingPanel } from "antd-mobile"
 
 import "./index.less"
 
+const floatingPanelAnchors = [160, 72 + 119, window.innerHeight * 0.8]
+
 export default (props) => {
     const post_id = props.match.params.post_id
 
@@ -35,5 +38,9 @@ export default (props) => {
 
     return <div className="postPage">
         <PostCard data={data} fullmode />
+
+        <FloatingPanel anchors={floatingPanelAnchors}>
+            <CommentsCard post_id={post_id} />
+        </FloatingPanel>
     </div>
 }

packages/app/src/theme/mobile.less

@@ -19,11 +19,33 @@
 			display: flex;
 			flex-direction: column;
 
-			.commentsWrapper {
+			height: 90vh;
-				position: absolute;
 
-				bottom: 0;
+			.postCard {
-				left: 0;
+				&.fullmode {
+					.wrapper {
+						height: 76vh;
+
+						.post_content {
+							.post_attachments {
+								height: 60vh;
+								overflow: hidden;
+
+								.carousel-root {
+									.carousel {
+										min-height: 200px;
+
+										>div {
+											display: flex;
+											align-items: center;
+											height: 100%;
+										}
+									}
+								}
+							}
+						}
+					}
+				}
 			}
 		}