Init project

2023-09-20 21:49:33 +08:00
parent 85a5989c96
commit c9ceac9f37
710 changed files with 125705 additions and 0 deletions
@@ -0,0 +1,104 @@
+<template>
+  <view class="page-v4 flex flex-wrap">
+
+    <view class="item" v-for="item in 9" :key="item">
+      <view class="img-box">
+        <image class="main-img" :src="webUrl+'/20220214125726718023.png'" mode="scaleToFill"></image>
+        <view class="label flex ai-center">
+          <image class="icon-live" :src="webUrl+'/20220218221956204228.png'" mode="scaleToFill"></image>
+          <text>文化展示</text>
+        </view>
+      </view>
+      <view class="info flex ai-center">
+        <image class="logo" :src="webUrl+'/20220105121325790975.png'" mode="scaleToFill"></image>
+        <view>
+          <view class="name">香道滇旗舰店</view>
+          <view class="sub">冬季上新买二送一！</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        webUrl: this.$VUE_APP_RESOURCES_URL
+      }
+    },
+    methods: {
+
+    }
+  }
+</script>
+
+<style lang="scss">
+  .page-v4 {
+    padding: 0 32rpx 24rpx;
+  }
+
+  .main-img {
+    width: 332rpx;
+    height: 360rpx;
+    border-radius: 8px;
+  }
+
+  .icon-live {
+    width: 26rpx;
+    height: 26rpx;
+    margin-right: 4rpx;
+  }
+
+  .logo {
+    width: 48rpx;
+    height: 48rpx;
+    border-radius: 50%;
+    margin-right: 8rpx;
+  }
+
+  .item {
+    width: 332rpx;
+    margin-top: 24rpx;
+    border-radius: 8px 8px 0 0;
+    background: #fff;
+
+    .name {
+      font-size: 24rpx;
+      font-weight: bold;
+      line-height: 34rpx;
+      color: #333333;
+    }
+
+    .sub {
+      font-size: 20rpx;
+      font-weight: bold;
+      line-height: 30rpx;
+      color: #999999;
+    }
+  }
+
+  .item:nth-child(2n) {
+    margin-left: 22rpx;
+  }
+
+  .info {
+    padding: 8rpx 16rpx 18rpx;
+  }
+
+.img-box{
+  position: relative;
+  .label {
+    position: absolute;
+    top: 14rpx;
+    left: 16rpx;
+    padding: 4rpx 14rpx 4rpx 10rpx;
+    border-radius: 20px;
+    font-size: 22rpx;
+    line-height: 1;
+    color: #FFFFFF;
+    background: rgba(0,0,0,.6);
+  }
+}
+ 
+</style>