1

app.wxss

@@ -50,4 +50,5 @@ page {
     --whiteColor: #ffffff;
     --redColor: #ff0000;
     --blueColor: #0000ff;
+    --greenColor: #008000;
 }

commpents/pagesMatchs/match/match-3.less

@@ -5,7 +5,7 @@
         display: flex;
         width: 96vw;
         padding: 2vw;
-        background: #f1f1f1;
+        background: var(--f1Color);
         margin: 0 0 1vw 0;
 
         .one_1 {
@@ -14,7 +14,7 @@
             button {
                 width: 100%;
                 padding: 2vw 1vw;
-                font-size: 14px;
+                font-size: var(--font14Size);
             }
         }
 
@@ -23,7 +23,7 @@
 
             input {
                 width: 96%;
-                border: 1px solid #858585;
+                border: 1px solid var(--f85Color);
                 padding: 1.5vw 1vw;
                 border-radius: 5px;
             }
@@ -38,139 +38,92 @@
         margin: 0 2vw;
 
         .list {
-            background-color: green;
+            background-color: var(--greenColor);
             margin: 0 0 2vw 0;
             padding: 2vw;
+
+            .list_1 {
+                .name {
+                    color: var(--whiteColor);
+                    padding: 0 0 2vw 0;
+                    font-size: 16px;
+
+                    text {
+                        padding: 0 2vw 0 0;
+                    }
+                }
+
+                .pk {
+                    display: flex;
+                    flex-direction: row;
+                    justify-content: space-between;
+                    background-color: var(--whiteColor);
+
+
+                    .pk_1 {
+                        text-align: center;
+                        flex-grow: 1;
+                        padding: 2vw 0;
+                    }
+
+                    .pk_2 {
+                        width: 30vw;
+                        text-align: center;
+                        box-shadow: 0 0 5px var(--f1Color);
+
+                        .time {
+                            padding: 1vw 0;
+                            background-color: var(--greenColor);
+                            color: var(--whiteColor);
+                            font-size: var(--font14Size);
+                        }
+
+                        .score {
+                            padding: 2vw 0;
+                            font-size: var(--font16Size);
+                            font-weight: bold;
+                        }
+                    }
+                }
+            }
+
+            .list_2 {
+                .name {
+                    color: var(--whiteColor);
+                    padding: 0 0 2vw 0;
+                    font-size: var(--font16Size);
+
+                    text {
+                        padding: 0 2vw 0 0;
+                    }
+                }
+
+                .person {
+                    display: flex;
+                    justify-content: space-between;
+                    flex-wrap: wrap;
+                    padding: 2vw 2vw 0 2vw;
+                    background-color: var(--whiteColor);
+
+                    .personList {
+                        width: 23vw;
+                        padding: 1.5vw;
+                        margin: 0 0 2vw 0;
+                        text-align: center;
+                        box-shadow: 0 0 2px var(--f85Color);
+                        border-radius: 4px;
+
+                        .list_1 {
+                            color: var(--greenColor);
+                            font-weight: bold;
+                        }
+                    }
+                }
+            }
         }
     }
 }
 
-// .c {
-//     width: 96vw;
-//     display: flex;
-//     flex-direction: column;
-
-//     .c_1 {
-//         width: 96vw;
-//         padding: 2vw;
-//         display: flex;
-//         flex-direction: row;
-//         justify-content: space-between;
-//         background-color: var(--f1Color);
-//         margin: 0 0 2vw 0;
-
-//         .c_1btn {
-//             width: 25vw;
-
-//             button {
-//                 width: 100%;
-//                 font-size: 14px;
-//                 padding: 2vw;
-//             }
-//         }
-
-//         .c_1inp {
-//             width: 66vw;
-
-//             input {
-//                 text-align: left;
-//                 border: 1px solid var(--fcColor);
-//                 padding: 1vw;
-//                 border-radius: 5px;
-//             }
-//         }
-//     }
-
-//     .c_2 {
-//         width: 94vw;
-//         position: relative;
-//         flex-grow: 1;
-//         height: 74.5vh;
-//         margin: 0 3vw;
-
-//         .cList {
-//             background-color: #328d26;
-//             margin: 0 0 2vw 0;
-//             padding: 2vw;
-
-//             .cList_0 {
-//                 .name {
-//                     padding: 1vw 0;
-//                     color: var(--whiteColor);
-//                     margin: 0 0 1vw 0;
-
-//                     text {
-//                         padding: 0 2vw 0 0;
-//                     }
-//                 }
-
-//                 .pk {
-//                     display: flex;
-//                     flex-direction: row;
-//                     justify-content: space-around;
-//                     background-color: var(--whiteColor);
-
-//                     .pk_1 {
-//                         width: 30vw;
-//                         text-align: center;
-//                         padding: 2vw;
-//                         line-height: 28px;
-//                     }
-
-//                     .pk_2 {
-//                         text-align: center;
-//                         box-shadow: 0 0 5px var(--fcColor);
-
-//                         .time {
-//                             background-color: #328d26;
-//                             color: var(--whiteColor);
-//                             padding: 1vw 0;
-//                             font-size: var(--font14Size);
-//                         }
-
-//                         .score {
-//                             font-size: var(--font20Szie);
-//                             padding: 1vw 0;
-//                             font-weight: bold;
-//                         }
-//                     }
-//                 }
-//             }
-
-//             .cList_1 {
-//                 text {
-//                     padding: 0 1vw;
-//                     color: var(--whiteColor);
-//                 }
-
-//                 .person {
-//                     margin: 2vw 0 1vw 0;
-//                     display: flex;
-//                     flex-direction: row;
-//                     justify-content: space-between;
-//                     flex-wrap: wrap;
-//                     background-color: var(--whiteColor);
-
-//                     .user_name {
-//                         width: 22vw;
-//                         margin: 1vw;
-//                         padding: 2vw;
-//                         text-align: center;
-//                         color: #328d26;
-//                         font-weight: 700;
-//                         border: 1px solid var(--f85Color);
-//                         border-radius: 2px;
-//                     }
-//                 }
-//             }
-//         }
-
-//         .cList:last-child {
-//             margin: 0;
-//         }
-//     }
-// }
-
 .scroll-view {
     position: absolute;
     top: 0;

commpents/pagesMatchs/match/match-3.wxml

@@ -35,12 +35,14 @@
                         </view>
                     </view>
                     <view class="list_2" wx:elif="{{cType=='1'}}">
-                        <text>{{item.group_id_name}}({{item.age}}岁)</text>
-                        <text>{{item.project_id_name}}({{item.projectAge}},{{item.pojectGender}})</text>
-                        <text>{{item.name}}</text>
+                        <view class="name">
+                            <text>{{item.group_id_name}}({{item.age}}岁)</text>
+                            <text>{{item.project_id_name}}({{item.projectAge}},{{item.pojectGender}})</text>
+                            <text>{{item.name}}</text>
+                        </view>
                         <view class="person">
-                            <view wx:for="{{item.person}}" wx:key="item">
-                                <view class="user_name">
+                            <view class="personList" wx:for="{{item.person}}" wx:key="item">
+                                <view class="list_1">
                                     <view>{{item.one||''||item.name}}</view>
                                     <view>{{item.two||''}}</view>
                                 </view>

commpents/pagesMatchs/match/match-3.wxss

@@ -3,7 +3,7 @@
   display: flex;
   width: 96vw;
   padding: 2vw;
-  background: #f1f1f1;
+  background: var(--f1Color);
   margin: 0 0 1vw 0;
 }
 .main .one .one_1 {
@@ -12,14 +12,14 @@
 .main .one .one_1 button {
   width: 100%;
   padding: 2vw 1vw;
-  font-size: 14px;
+  font-size: var(--font14Size);
 }
 .main .one .one_2 {
   flex-grow: 1;
 }
 .main .one .one_2 input {
   width: 96%;
-  border: 1px solid #858585;
+  border: 1px solid var(--f85Color);
   padding: 1.5vw 1vw;
   border-radius: 5px;
 }
@@ -31,10 +31,72 @@
   margin: 0 2vw;
 }
 .main .two .list {
-  background-color: green;
+  background-color: var(--greenColor);
   margin: 0 0 2vw 0;
   padding: 2vw;
 }
+.main .two .list .list_1 .name {
+  color: var(--whiteColor);
+  padding: 0 0 2vw 0;
+  font-size: 16px;
+}
+.main .two .list .list_1 .name text {
+  padding: 0 2vw 0 0;
+}
+.main .two .list .list_1 .pk {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  background-color: var(--whiteColor);
+}
+.main .two .list .list_1 .pk .pk_1 {
+  text-align: center;
+  flex-grow: 1;
+  padding: 2vw 0;
+}
+.main .two .list .list_1 .pk .pk_2 {
+  width: 30vw;
+  text-align: center;
+  box-shadow: 0 0 5px var(--f1Color);
+}
+.main .two .list .list_1 .pk .pk_2 .time {
+  padding: 1vw 0;
+  background-color: var(--greenColor);
+  color: var(--whiteColor);
+  font-size: var(--font14Size);
+}
+.main .two .list .list_1 .pk .pk_2 .score {
+  padding: 2vw 0;
+  font-size: var(--font16Size);
+  font-weight: bold;
+}
+.main .two .list .list_2 .name {
+  color: var(--whiteColor);
+  padding: 0 0 2vw 0;
+  font-size: var(--font16Size);
+}
+.main .two .list .list_2 .name text {
+  padding: 0 2vw 0 0;
+}
+.main .two .list .list_2 .person {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  padding: 2vw 2vw 0 2vw;
+  background-color: var(--whiteColor);
+}
+.main .two .list .list_2 .person .personList {
+  width: 23vw;
+  padding: 1.5vw;
+  margin: 0 0 2vw 0;
+  text-align: center;
+  box-shadow: 0 0 2px var(--f85Color);
+  border-radius: 4px;
+}
+.main .two .list .list_2 .person .personList .list_1 {
+  color: var(--greenColor);
+  font-weight: bold;
+}
 .scroll-view {
   position: absolute;
   top: 0;