修改好友动态、发布动态、促销模块、创建帖子，Resolve review.
Change-Id: I84a2460dd1208bc703b0527d98225204d03e5efc
diff --git a/src/pages/FriendMoments/FriendMoments.css b/src/pages/FriendMoments/FriendMoments.css
index c95bdcf..a69d919 100644
--- a/src/pages/FriendMoments/FriendMoments.css
+++ b/src/pages/FriendMoments/FriendMoments.css
@@ -1,88 +1,171 @@
-/* .friend-moments {
- background-color: #5F4437;
- color: white;
- }
- .header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 10px;
- }
- .logo-and-name {
- display: flex;
- align-items: center;
- }
- .logo {
- height: 30px;
- margin-right: 10px;
- }
- .site-name {
- font-size: 24px;
- }
- .user-and-message {
- display: flex;
- align-items: center;
- }
- .user-avatar {
- height: 40px;
- margin-right: 10px;
- }
- .message-center {
- font-size: 16px;
- }
- .nav {
- background-color: #dab8c2;
- display: flex;
- justify-content: center;
- }
- .nav-item {
- color: white;
- text-decoration: none;
- padding: 10px 20px;
- }
- .active {
- background-color: #996633;
- }
- .content {
- padding: 20px;
- }
- .user-post {
- border-bottom: 1px solid white;
- margin-bottom: 20px;
- padding-bottom: 20px;
- }
- .user-info {
- display: flex;
- align-items: center;
- margin-bottom: 10px;
- }
- .user-avatar-small {
- height: 30px;
- margin-right: 10px;
- }
- .username {
- font-size: 16px;
- }
- .post-content {
- margin-bottom: 10px;
- }
- .post-actions {
- display: flex;
- align-items: center;
- margin-bottom: 10px;
- }
- .like-icon,
- .comment-icon {
- margin-right: 5px;
- }
- .like-count,
- .comment-count {
- margin-left: 5px;
- }
- .post-image {
- float: right;
- width: 150px;
- height: 150px;
- background-color: #ddd;
- margin-left: 10px;
- } */
\ No newline at end of file
+.friend-moments-container {
+ margin: 0 auto;
+ background: linear-gradient(180deg, #5F4437, #823c3c);
+ padding-bottom: 40px;
+}
+
+.fm-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 2%;
+}
+
+
+.f-search-bar {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+}
+
+.search-input {
+ padding: 6px 8px;
+ font-size: 14px;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+}
+
+.search-btn {
+ padding: 6px 12px;
+ font-size: 14px;
+ cursor: pointer;
+ background: #fff;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+}
+
+.feed-list .feed-item {
+ padding: 1% 1.5%;
+ margin: 1% 2%;
+ border-radius: 6px;
+ /*设置item之间的间隔*/
+ margin-bottom: 2%;
+ background-color: #e9ded2;
+}
+
+.feed-item h4 {
+ margin: 0 0 5px;
+}
+
+.feed-item p {
+ margin: 0 0 10px;
+ line-height: 1.4;
+}
+
+.feed-images {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 6px;
+ margin-bottom: 10px;
+}
+
+.feed-images img {
+ width: 100px;
+ height: 100px;
+ object-fit: cover;
+ border-radius: 4px;
+ border: 1px solid #ddd;
+}
+
+.feed-footer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 12px;
+ color: #666;
+}
+
+.delete-btn {
+ background: none;
+ border: none;
+ color: #f44;
+ cursor: pointer;
+ font-size: 12px;
+}
+
+/* Modal 样式 */
+.modal-overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,0.5);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ z-index: 1000;
+}
+
+.modal-dialog {
+ background: #e9ded2;
+ padding: 20px;
+ width: 35%;
+ border-radius: 8px;
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+/* 标题 */
+.modal-dialog h3 {
+ margin: 0;
+ color : #4A3B34;
+}
+
+.modal-dialog input[type="text"],
+.modal-dialog textarea {
+ width: 97%;
+ padding: 8px;
+ font-size: 14px;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+}
+
+.modal-dialog input[type="file"] {
+ width: 97%;
+ font-size: 14px;
+ border-radius: 4px;
+}
+
+.modal-dialog textarea {
+ resize: vertical;
+ min-height: 80px;
+}
+
+.cf-preview {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+}
+
+.cf-preview img {
+ width: 80px;
+ height: 80px;
+ object-fit: cover;
+ border-radius: 4px;
+ border: 1px solid #bbb;
+}
+
+.modal-actions {
+ display: flex;
+ justify-content: flex-end;
+ margin-top: 10px;
+}
+
+.modal-actions .btn {
+ padding: 6px 12px;
+ font-size: 14px;
+ cursor: pointer;
+ border: none;
+ border-radius: 4px;
+}
+
+.modal-actions .btn.cancel {
+ background: #5F4437;
+}
+
+.modal-actions .btn.submit {
+ background: #BA929A;
+ color: #fff;
+}