消息

miniprogram/pages/message/message.json

@@ -1,8 +1,8 @@
 {
-    "navigationBarTitleText": "我的",
+    "navigationBarTitleText": "消息",
-    "navigationStyle": "custom",
+   
-    "navigationBarTextStyle": "white",
+   
-    "enablePullDownRefresh": true,
+  
-    "backgroundColor": "#f8f8f8",
+    "backgroundColor": "#fff",
     "backgroundTextStyle": "dark"
   }

miniprogram/pages/message/message.wxml

@@ -1,32 +1,33 @@
-<view class="header">
+<!-- <view class="header">
     <image src="../../images/back.png" class="back" style=" top: {{statusHeight}}px;" bindtap="back"></image>
     <image class="header-bg" src="../../images/bg.png" mode="widthFix" />
     <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
         我的
     </view>
-</view>
+</view> -->
-<view class="flex">
+<view class=" top20">
-    <view class="touxiang">
-        <image></image>
-    </view>
-    <view class="touxiang_text">alddd</view>
-</view>
-<view class="grid2outer">
-    <navigator url="" class="grid2 blue">
-        <view>
-            <view class="h1">个人信息</view>
-            <view class="h2">编辑信息内容</view>
-        </view>
-        <image src="../../images/my/my01.png" />
-    </navigator>
-    <view class="w40"></view>
-    <navigator url="" class="grid2 red">
-        <view>
-            <view class="h1">退出登录</view>
-            <view class="h2">点击退出页面</view>
-        </view>
-        <image src="../../images/my/my02.png" />
-    </navigator>
 
+    <view class="list">
+        <view class="item">
+            <image src="../../images/message/01.png"></image>
+            <view class="vbetween">
+                <view class="h1">系统消息</view>
+                <view class="h2">
+                    消息内容简介消息简介
+                </view>
+            </view>
+            <view class="time">2023-05-22</view>
+        </view>
+        <view class="item">
+            <image src="../../images/message/02.png"></image>
+            <view class="vbetween">
+                <view class="h1">活动消息</view>
+                <view class="h2">
+                    消息内容简介消息简介
+                </view>
+            </view>
+            <view class="time">2023-05-22</view>
+        </view>
 
+    </view>
 </view>

miniprogram/pages/message/message.wxss

@@ -4,7 +4,7 @@ page {
     overflow-y: auto;
     background: #f7f7f7;
     font-family: PingFang SC;
-    background: linear-gradient(180deg, #E82C19 0%, #F7F7F9 50%);
+  
 }
 
 .header {
@@ -38,7 +38,7 @@ page {
     position: relative;
     z-index: 1;
 }
-
+.top20{margin-top: 20rpx;}
 .w20 {
     width: 38rpx;
 }
@@ -47,215 +47,38 @@ page {
     flex: 1;
 }
 
-.mtf80 {
-    margin-top: -80rpx;
-}
-
-.back {
-    width: 20rpx;
-    height: 20rpx;
-    margin-left: 20rpx;
-    position: absolute;
-    margin-top: 20rpx;
-    border-radius: 0rpx;
-    z-index: 2;
-}
-
 .list {
-    padding: 20rpx 35rpx;
+    padding: 0rpx 40rpx;
-
-}
-
-.list .item {
-    padding: 50rpx 40rpx;
-
-    display: flex;
     background-color: #fff;
-    border-radius: 10rpx;
-    margin-bottom: 20rpx;
 }
 
-.vcenter {
+.list .item {
+    padding: 45rpx 0rpx;
+    border-bottom: solid #F5F5F5 1px;
     display: flex;
-    flex-direction: column;
-    justify-content: center;
 }
 
-.list .item .icon {
+.list .item image {
     width: 70rpx;
     height: 70rpx;
-    margin-right: 20rpx;
+    margin-right: 25rpx;
-    border-radius: 0rpx;
+    border-radius: 12rpx;
 }
-
+.list .item .vbetween{
-.list .item .go {
+    flex: 1;
-    width: 38rpx;
-    height: 38rpx;
-    margin-right: 20rpx;
-    border-radius: 0rpx;
 }
-
 .list .item .h1 {
-    font-size: 36rpx;
+    font-size: 34rpx;
-
+    color: #333333;
-    line-height: 1rem;
+    margin-bottom: 20rpx; line-height: 1rem;
-    margin-bottom: 20rpx;
 }
 
 .list .item .h2 {
-    font-size: 28rpx;
+    font-size: 26rpx;
-
+    color: #999999;
     line-height: 1rem;
 }
+.list .item .time{
    
-.list .item .h2 .time {
+    color: #BABABA; font-size: 24rpx;line-height: 45rpx;
-    float: right;
-}
-
-.color01 {
-    border-image: linear-gradient(124deg, #FFFFFF, #FFFFFF) 10 10;
-    background: linear-gradient(82deg, #FFFFFF 0%, #000000 0%, #F2FFFB 0%, #E5FFF9 100%);
-    color: #224D3F;
-}
-
-.color02 {
-    border-image: linear-gradient(124deg, #FFFFFF, #FFFFFF) 10 10;
-    background: linear-gradient(82deg, #F2FFFB 0%, #FFFFFF 0%, #F2FAFD 0%, #E5F6FF 100%);
-    box-shadow: 0px 4px 12px 0px rgba(202, 202, 202, 0.24);
-    color: #3B5B8C;
-}
-
-.color03 {
-    border-image: linear-gradient(146deg, #FFFFFF, #FFFFFF) 10 10;
-    background: linear-gradient(82deg, #F8FAFF 0%, #F9FFFD 0%, #F6FDFF 0%, #EBFAFF 100%);
-    box-shadow: 0px 4px 12px 0px rgba(202, 202, 202, 0.24);
-    color: #117589;
-}
-
-.color04 {
-    border-image: linear-gradient(146deg, #FFFFFF, #FFFFFF) 10 10;
-    background: linear-gradient(82deg, #FEFEF2 0%, #F2FAFD 0%, #FFFEFA 0%, #FEF8E8 100%);
-    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.42);
-    color: #A96C35;
-}
-
-.color05 {
-    background: linear-gradient(82deg, #FEF2F3 0%, #FFFCFB 0%, #F8F4FF 0%, #EFE4FF 100%);
-    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.4);
-    color: #856AAD;
-}
-
-.color06 {
-    background: linear-gradient(82deg, #E6EEFF 0%, #FAFCFF 0%, #EDF3FF 0%, #D8E5FF 100%);
-    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.4);
-    color: #5374B2;
-}
-
-.color01 .h2 {
-    color: #6A8079;
-}
-
-.color02 .h2 {
-    color: #5E89B3;
-}
-
-.color03 .h2 {
-    color: #488D9A;
-}
-
-.color04 .h2 {
-    color: #B98A60;
-}
-
-.color05 .h2 {
-    color: #9484AC;
-}
-
-.color06 .h2 {
-    color: #6D89BF;
-}
-
-.grid2outer {
-    display: flex;
-    justify-content: space-between;
-    margin: 30rpx;
-
-}
-.flex {
-    display: flex;
-  
-    margin: 30rpx;
-
-}
-.touxiang image{
-    width: 110rpx;
-    height: 110rpx;
-    background-color: #fff;
-    border-radius: 100%;
-}
-.touxiang_text
-{
-  
-font-size: 36rpx;
-line-height: 110rpx;
-margin-left: 10rpx;
-font-weight: bold;
-color: #FFFFFF;
-}
-.grid2 {
-    flex: 1;
-    background: linear-gradient(90deg, #F5F9FE 0%, #FBFDFF 100%);
-    border-radius: 16rpx;
-    display: flex;
-    padding:15rpx 30rpx;
-    margin: 20rpx 0rpx 0rpx;
-    justify-content:space-between;
-}
-
-
-.grid2 .h1 {
-    font-size: 32rpx;
-    font-weight: bold;
-    line-height: 36rpx;
-    margin-top: 15rpx;
-}
-
-.grid2 .h2 {
-    height: 23rpx;
-    font-size: 24rpx;
-    line-height: 36rpx;
-}
-
-.grid2 image {
-    width:100rpx;
-    height: 100rpx;
-   
-}
-
-.blue {
-    background: linear-gradient(270deg, #E6F6F8 0%, #FFFFFF 100%);
-}
-
-.blue .h1 {
-    color: #4F9E97;
-}
-
-.blue .h2 {
-    color: #83B3AF;
-}
-
-.red {
-    background: linear-gradient(270deg, #FDF5F3 0%, #FFFFFF 100%);
-}
-
-.red .h1 {
-    color: #C29266;
-}
-
-.red .h2 {
-    color: #CEAA89;
-}
-
-.w40 {
-    width: 20rpx;
 }