top

miniprogram/app.wxss

@@ -66,3 +66,4 @@
   height: 84rpx;
   opacity: 0;
 }
+.bgw{background-color: #fff;}

miniprogram/pages/home/home.wxml

@@ -24,7 +24,24 @@
             <view>西海岸先锋</view>
         </view>
     </view>
+    <view class="gridouter">
+        <view class="grid2 blue">
+            <image src="../../images/main/home05.png" />
+            <view>
+                <view class="h1">在职党员</view>
+                <view class="h2">到居住社区报到</view>
+            </view>
+        </view>
+        <view class="grid2 red">
+            <image src="../../images/main/home06.png" />
+            <view>
+                <view class="h1">红色尖兵</view>
+                <view class="h2">志愿服务队</view>
+            </view>
         </view>
+    </view>
+</view>
+
 <view class="home" style="margin-top: {{statusHeight + navigationHeight}}px">
 
     <!-- <view class="belong-grid">

miniprogram/pages/home/home.wxss

@@ -3,6 +3,7 @@ page {
     height: auto;
     overflow-y: auto;
     background: #f7f7f7;
+    font-family: PingFang SC;
 }
 
 .header {
@@ -140,6 +141,7 @@ page {
     font-size: 36rpx;
     color: #04BCA0;
 }
+
 .bgw {
     background-color: #fff;
     margin: 20rpx;
@@ -149,11 +151,13 @@ page {
     box-sizing: border-box;
     z-index: 1;
 }
+
 .gridouter {
     display: flex;
     justify-content: space-around;
 
 }
+
 .grid {
     width: 25%;
     text-align: center;
@@ -167,3 +171,51 @@ page {
     height: 80rpx;
 
 }
+
+.grid2 {
+    width: 50%;
+    background: linear-gradient(90deg, #F5F9FE 0%, #FBFDFF 100%);
+    border-radius: 16rpx;
+    display: flex;
+    padding: 30rpx;
+    margin: 20rpx 10rpx;
+}
+
+.grid2 .h1 {
+   
+    font-size: 32rpx;
+    font-weight: bold;
+    line-height: 32rpx;
+}
+
+.grid2 .h2 {
+    height: 23rpx;
+    font-size: 24rpx;
+    line-height: 36rpx;
+}
+
+.grid2 image {
+    width: 64rpx;
+    height: 64rpx;
+    margin-right:10rpx
+}
+
+.blue {
+    background: linear-gradient(90deg, #F5F9FE 0%, #FBFDFF 100%);
+}
+
+.blue .h1 {
+    color: #5A89B7;
+}
+
+.blue .h2 {
+    color: #80A4C7;
+}
+
+.red { background: linear-gradient(90deg, #FEFBF0 0%, #FFFDF9 100%);}
+
+.red .h1 {color: #CD9058;}
+
+.red .h2 {
+    color: #C89C74;
+}