feat: 调整样式
This commit is contained in:
@@ -3,6 +3,7 @@
|
||||
"disableScroll": true,
|
||||
"usingComponents": {
|
||||
"t-icon": "tdesign-miniprogram/icon/icon",
|
||||
"t-image": "tdesign-miniprogram/image/image"
|
||||
"t-image": "tdesign-miniprogram/image/image",
|
||||
"t-swipe-cell": "tdesign-miniprogram/swipe-cell/swipe-cell"
|
||||
}
|
||||
}
|
||||
@@ -12,25 +12,29 @@
|
||||
<view wx:if="{{myPublishedPosts.length > 0}}" class="posts-list">
|
||||
<view wx:for="{{myPublishedPosts}}" wx:key="id" class="my-post-card">
|
||||
<view class="my-post-time">{{item.time}}</view>
|
||||
<view class="my-post-content-wrap">
|
||||
<view class="post-header" wx:if="{{item.hasReviewed !== undefined}}">
|
||||
<view class="status-tag pending" wx:if="{{item.hasReviewed === 0}}">待审核</view>
|
||||
<view class="status-tag success" wx:if="{{item.hasReviewed === 1}}">已发布</view>
|
||||
</view>
|
||||
<text class="post-text">{{item.content}}</text>
|
||||
<view wx:if="{{item.images.length > 0}}" class="my-post-images">
|
||||
<t-image wx:for="{{item.images}}" wx:for-item="img" wx:key="*this"
|
||||
src="{{img}}" mode="aspectFill" width="140rpx" height="140rpx"
|
||||
shape="round" />
|
||||
</view>
|
||||
<view class="my-post-footer">
|
||||
<view class="footer-item"><t-icon name="heart" size="28rpx" /> <text>{{item.likes.length}}</text></view>
|
||||
<view class="footer-item"><t-icon name="chat" size="28rpx" /> <text>{{item.comments.length}}</text></view>
|
||||
<view class="footer-item" catchtap="deletePost" data-id="{{item.id}}" style="margin-left:auto; color: #EF5350;">
|
||||
<t-icon name="delete" size="28rpx" />
|
||||
<t-swipe-cell class="post-swipe-cell">
|
||||
<view class="my-post-content-wrap">
|
||||
<view class="post-header" wx:if="{{item.hasReviewed !== undefined}}">
|
||||
<view class="status-tag pending" wx:if="{{item.hasReviewed === 0}}">待审核</view>
|
||||
<view class="status-tag success" wx:if="{{item.hasReviewed === 1}}">已发布</view>
|
||||
</view>
|
||||
<text class="post-text">{{item.content}}</text>
|
||||
<view wx:if="{{item.images.length > 0}}" class="my-post-images">
|
||||
<t-image wx:for="{{item.images}}" wx:for-item="img" wx:key="*this"
|
||||
src="{{img}}" mode="aspectFill" width="140rpx" height="140rpx"
|
||||
shape="round" />
|
||||
</view>
|
||||
<view class="my-post-footer">
|
||||
<view class="footer-item"><t-icon name="heart" size="28rpx" /> <text>{{item.likes.length}}</text></view>
|
||||
<view class="footer-item"><t-icon name="chat" size="28rpx" /> <text>{{item.comments.length}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view slot="right" class="delete-action" catchtap="deletePost" data-id="{{item.id}}">
|
||||
<view class="delete-btn">
|
||||
<t-icon name="delete" size="40rpx" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</t-swipe-cell>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:else class="empty-state">
|
||||
|
||||
@@ -161,10 +161,34 @@
|
||||
|
||||
|
||||
|
||||
/* Hide Scrollbar Globally */
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
color: transparent;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.post-swipe-cell {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.delete-action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 140rpx;
|
||||
height: 100%;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 50%;
|
||||
background: #EF5350;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 4rpx 12rpx rgba(239, 83, 80, 0.4);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user