。

src/pages/index/components/Card.js → src/pages/index/components/Card/index.jsx

@@ -7,6 +7,7 @@ import glTip from '@/assets/icons/housemantj/gltip.png'
 import location from '@/assets/icons/housemantj/location.png'
 import onlove from '@/assets/icons/housemantj/onlove.png'
 import love from '@/assets/icons/housemantj/bheart.png'
+import './style.less'
 
 export default (props) => {
 

src/pages/index/components/Card/style.less

@@ -0,0 +1,70 @@
+.contentCard{
+  background: #FFF;
+  box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
+  border-radius: 24px;
+  overflow: hidden;
+  margin-bottom:50px;
+  break-inside: avoid;
+  position: relative;
+
+  .cardTop{
+    border-radius: 24px 24px 0px 0px;
+    .cCardimg{
+      width: 100%;
+      border-radius: 24px 24px 0px 0px;
+    }
+    .lefttips{
+      width:99px;
+      height:37px;
+      position: absolute;
+      left: 0;
+      top: 0;
+    }
+    .loveharde{
+      width: 28px;
+      height: 26px;
+      position: absolute;
+      right: 20px;
+      top: 10px;
+    }
+  }
+  .bContent{
+    padding:20px;
+    .cCword{
+      font-size: 24px;
+      font-weight: bold;
+      color: #404040;
+      text-align: justify;
+    }
+    
+    .cCleft{
+      float: left;
+      position: relative;
+      padding:40px 0 30px 0;
+      .cCicon{
+        width: 17px;
+        height: 21px;
+        position: absolute;
+        left: 0;
+        top: 48px;
+      }
+      .distance{
+        padding-left: 24px;
+        font-size: 24px;
+        color: #C0C8D3;
+      }
+    }
+    .cCright{
+      position: relative;
+      float: right;
+      padding:40px 0 30px 0;
+      .price{          
+        font-size: 24px;
+        color: #FF3434;
+        .money{
+          font-size: 20px;
+        }
+      }
+    }
+  }
+}

src/pages/index/tabs/less/Recommend.less

@@ -31,78 +31,7 @@
   column-count: 2;      //分两列
   column-gap: 30px;    //列间距
   background-color: #F8F8F8;
-  padding:30px 30px 0 30px;
-  
-  .contentCard{
-    background: #FFF;
-    box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
-    border-radius: 24px;
-    overflow: hidden;
-    margin-bottom:50px;
-    break-inside: avoid;
-    position: relative;
-
-    .cardTop{
-      border-radius: 24px 24px 0px 0px;
-      .cCardimg{
-        width: 100%;
-        border-radius: 24px 24px 0px 0px;
-      }
-      .lefttips{
-        width:99px;
-        height:37px;
-        position: absolute;
-        left: 0;
-        top: 0;
-      }
-      .loveharde{
-        width: 28px;
-        height: 26px;
-        position: absolute;
-        right: 20px;
-        top: 10px;
-      }
-    }
-    .bContent{
-      padding:20px;
-      .cCword{
-        font-size: 24px;
-        font-weight: bold;
-        color: #404040;
-        text-align: justify;
-      }
-      
-      .cCleft{
-        float: left;
-        position: relative;
-        padding:40px 0 30px 0;
-        .cCicon{
-          width: 17px;
-          height: 21px;
-          position: absolute;
-          left: 0;
-          top: 48px;
-        }
-        .distance{
-          padding-left: 24px;
-          font-size: 24px;
-          color: #C0C8D3;
-        }
-      }
-      .cCright{
-        position: relative;
-        float: right;
-        padding:40px 0 30px 0;
-        .price{          
-          font-size: 24px;
-          color: #FF3434;
-          .money{
-            font-size: 20px;
-          }
-        }
-      }
-    }
-  }
+  padding:30px 30px 0 30px; 
 } 
 .botton{
   font-size: 28px;

src/pages/searchResult/searchResult.less

@@ -32,80 +32,6 @@
   column-gap: 30px;    //列间距
   background-color: #F8F8F8;
   padding:30px 30px 0 30px;
-  
-  .contentCard{
-    background: #FFF;
-    box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
-    border-radius: 24px;
-    overflow: hidden;
-    margin-bottom:50px;
-    break-inside: avoid;
-    position: relative;
-
-    .cardTop{
-      border-radius: 24px 24px 0px 0px;
-      .cCardimg{
-        width: 100%;
-        border-radius: 24px 24px 0px 0px;
-      }
-      .lefttips{
-        width:99px;
-        height:37px;
-        position: absolute;
-        left: 0;
-        top: 0;
-      }
-      .loveharde{
-        width: 22px;
-        height: 20px;
-        position: absolute;
-        right: 20px;
-        top: 10px;
-      }
-    }
-    .bContent{
-      padding:20px;
-      .cCword{
-        font-size: 24px;
-        font-weight: bold;
-        color: #404040;
-      }
-      
-      .cCleft{
-        float: left;
-        position: relative;
-        padding:40px 0 30px 0;
-        .cCicon{
-          width: 17px;
-          height: 21px;
-          position: absolute;
-          left: 0;
-          top: 48px;
-        }
-        .distance{
-          padding-left: 24px;
-          font-size: 24px;
-          color: #C0C8D3;
-        }
-      }
-      .cCright{
-        position: relative;
-        float: right;
-        padding:40px 0 30px 0;
-        .money{
-          font-size: 20px;
-          color: #FF3434;          
-          position: absolute;
-          right: 78px;
-          bottom: 32px;
-        }
-        .price{
-          font-size: 24px;
-          color: #FF3434;
-        }
-      }
-    }
-  }
 } 
 .botton{
   font-size: 28px;