add mainView, reward, community pages
Change-Id: I70da6ed3e91ebf4124c2074b6508192a19ed9909
diff --git "a/src/app/reward/reward-detail/\133rewardId\135/reward-detail.scss" "b/src/app/reward/reward-detail/\133rewardId\135/reward-detail.scss"
new file mode 100644
index 0000000..a38cd0a
--- /dev/null
+++ "b/src/app/reward/reward-detail/\133rewardId\135/reward-detail.scss"
@@ -0,0 +1,93 @@
+.reward-detail {
+ max-width: 1200px;
+ margin: 0 auto;
+ padding: 2rem;
+
+ // 把标题和用户信息、发布时间都放到同一个 flex 容器里
+ .reward-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 2rem;
+
+ h1 {
+ order: 1;
+ font-size: 2rem;
+ color: #1a202c;
+ margin: 0;
+ }
+
+ .post-time {
+ order: 3;
+ color: #718096;
+ font-size: 0.875rem;
+ }
+ }
+
+ // 贴子正文,文本在左,图片 + 价格 + 按钮在右
+ .reward-content {
+ display: flex;
+ flex-direction: row;
+ align-items: flex-start;
+ margin-top: 1rem;
+
+
+ .reward-info-container {
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+ width: 50%;
+
+ .user-info {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+ }
+
+ // 文本部分
+ .reward-info {
+
+ p {
+ font-size: 1rem;
+ line-height: 1.75;
+ color: #4a5568;
+ margin-bottom: 2rem;
+ }
+ }
+ }
+
+
+
+
+ // 右侧媒体区:图片、价格、提交按钮
+ .reward-media {
+ display: flex;
+ width: 50%;
+ flex-direction: column;
+ justify-content: flex-end;
+ align-items: flex-end;
+ gap: 2rem;
+
+ img {
+ margin-top: 1rem;
+ border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
+ }
+
+ .reward-actions {
+ min-width: 120px;
+ display: flex;
+ flex-direction: row;
+ gap: 1rem;
+ margin-bottom: 2rem;
+
+ .reward-price {
+ font-size: 2rem;
+ font-weight: bold;
+ color: #2c3e50;
+ margin-bottom: 0.5rem;
+ }
+
+ }
+ }
+ }
+}
\ No newline at end of file