wip: 4.0

2024-05-16 14:27:57 +08:00
parent b09c1d9537
commit 8f3b158032
72 changed files with 3931 additions and 2161 deletions
--- a/src/pages/mer/mer_detail/index.scss
+++ b/src/pages/mer/mer_detail/index.scss
@@ -0,0 +1,161 @@
+page {
+  // IOS安全区域
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  -nut-tabs-titles-item-color: #8c8c8c;
+  -nut-tabs-titles-item-active-color: #333333;
+}
+
+.head-wrapper {
+  z-index: 999;
+  display: flex;
+  align-items: center;
+  position: fixed;
+  left: 30px;
+  top: 0;
+  //height: 114px;
+}
+
+.head-menu {
+  display: flex;
+  align-items: center;
+  height: 54px;
+  width: 140px;
+  background: rgba(0, 0, 0, 0.25);
+  border-radius: 27px;
+
+  .iconfont {
+    flex: 1;
+    text-align: center;
+    color: #fff;
+    box-sizing: border-box;
+  }
+}
+
+.nut-swiper {
+  height: 550px;
+}
+
+.infoBox {
+  background-color: #fff;
+  padding: 30px;
+  border-radius: 25px;
+  position: relative;
+  top: -50px;
+
+  .title {
+    font-size: large;
+    font-weight: bold;
+    font-size: 40px;
+  }
+
+  .line {
+    margin: 30px auto;
+    width: 670px;
+    height: 1px;
+    background-color: rgba(240, 240, 240, 1);
+  }
+
+  .bom {
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    margin-top: 10px;
+
+    .left {
+      width: 75%;
+
+      .sub {
+        color: #999;
+        font-size: 27px;
+      }
+    }
+
+    .right {
+      flex: 1;
+      display: flex;
+      justify-content: space-between;
+      color: #999;
+      text-align: center;
+    }
+
+
+  }
+}
+.btn {
+  background-color: #ff0000;
+  color: #fff;
+  border-radius: 50%;
+  text-align: center;
+  line-height: 65px;
+  width: 45px;
+  height: 45px;
+}
+
+.good-class {
+  .nut-tabs {
+    height: 100vh;
+    // border-top: #fff 10px solid;
+    .nut-tabs__titles {
+      padding: 20px 0;
+    }
+
+    .nut-tab-pane {
+      border-radius: 20px;
+      padding: 25px;
+    }
+  }
+}
+
+.list {
+  .item {
+    display: flex;
+    margin-bottom: 20px;
+
+    image {
+      width: 180px;
+      height: 180px;
+      border-radius: 15px;
+    }
+
+    .right {
+      flex: 1;
+      margin-left: 15px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      // text-align: right;
+
+      .stock {
+        margin-top: 10px;
+        color: #8f8f8f;
+      }
+
+      .name {
+        // height: 20px;
+        font-size: 28px;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        overflow: hidden;
+        word-break: break-word;
+      }
+
+      .bom {
+        display: flex;
+        justify-content: space-between;
+        align-items: flex-end;
+        //margin-top: 10px;
+
+        .price {
+          font-size: 20px;
+          font-weight: bold;
+          color: #ff0000;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 1;
+          overflow: hidden;
+        }
+      }
+    }
+  }
+}