Commit f526ace5 authored by 张娇(东信)'s avatar 张娇(东信)

修改icon

parent 969a3e46
<template> <template>
<view style="background-color: #f3f3f3; height: 100vh"> <view style="background-color: #f3f3f3; height: 100vh">
<view class="container"> <view class="container">
<view class="top"> <view>
<view class="left-icon"></view> <img src="/static/assets/bottom.png" style="width: 750rpx; height: 32rpx" />
<view class="bottom-image"> <img src="/static/assets/bacImg.png" style="width: 750rpx; height: 440rpx" />
<view class="right-image"></view> <img src="/static/assets/right.png" />
</view>
</view> </view>
<view class="sort"> <view class="sort">
<view style="display: flex; flex-direction: row"> <view style="display: flex; flex-direction: row">
<view class="borderClass"> <view class="borderClass">
<img src="/static/assets/buildingAgriculture.png" style="width: 48px; height: 48px" /> <img src="/static/assets/buildingAgriculture.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">筑农严选</view> <view class="sort-text">筑农严选</view>
</view> </view>
<view class="borderClass"> <view class="borderClass">
<img src="/static/assets/rural.png" style="width: 48px; height: 48px" /> <img src="/static/assets/rural.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">认养农业</view> <view class="sort-text">认养农业</view>
</view> </view>
<view class="borderClass"> <view class="borderClass">
<img src="/static/assets/adoption.png" style="width: 48px; height: 48px" /> <img src="/static/assets/adoption.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">乡村旅居</view> <view class="sort-text">乡村旅居</view>
</view> </view>
<view class="borderClass"> <view class="borderClass">
<img src="/static/assets/adoption.png" style="width: 48px; height: 48px" /> <img src="/static/assets/adoption.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">特色农庄</view> <view class="sort-text">特色农庄</view>
</view> </view>
</view> </view>
...@@ -34,15 +33,15 @@ ...@@ -34,15 +33,15 @@
</view> </view>
<view style="display: flex; flex-direction: row"> <view style="display: flex; flex-direction: row">
<view class="detail-border"> <view class="detail-border">
<img src="/static/assets/detailedMapOne.png" style="width: 108px; height: 88px" /> <img src="/static/assets/detailedMapOne.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">干辣椒炒肉</view> <view class="detail-title">干辣椒炒肉</view>
</view> </view>
<view class="detail-border"> <view class="detail-border">
<img src="/static/assets/detailedMapTwo.png" style="width: 108px; height: 88px" /> <img src="/static/assets/detailedMapTwo.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">贵阳辣子鸡</view> <view class="detail-title">贵阳辣子鸡</view>
</view> </view>
<view class="detail-border"> <view class="detail-border">
<img src="/static/assets/detailedMapThree.png" style="width: 108px; height: 88px" /> <img src="/static/assets/detailedMapThree.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">麻辣鱼豆腐</view> <view class="detail-title">麻辣鱼豆腐</view>
</view> </view>
</view> </view>
...@@ -56,52 +55,43 @@ ...@@ -56,52 +55,43 @@
<style lang="scss"> <style lang="scss">
.container { .container {
position: relative; position: relative;
left: 0px; left: 0rpx;
top: 0px; top: 0rpx;
width: 375px; width: 750rpx;
height: 220px; height: 440rpx;
opacity: 1; opacity: 1;
background-image: url('@/static/assets/矩形 196@1x.png');
} }
.bottom-image { .bottom-image {
position: relative; position: relative;
left: 0px; top: -40rpx;
top: 204px; width: 750rpx;
width: 375px; height: 32rpx;
height: 16px;
opacity: 1; opacity: 1;
background: url('@/static/assets/矩形 198@1x.png');
} }
.right-image { .right-image {
top: -192rpx;
float: right; float: right;
position: relative; position: relative;
left: 231px;
top: -45px;
width: 144px;
height: 62px;
opacity: 1;
background: url('@/static/assets/图层 1@1x.png');
} }
.sort { .sort {
position: relative; position: relative;
left: 0px; //left: 0rpx;
top: 200px; top: 400rpx;
width: 375px; width: 750rpx;
height: 93px; height: 186rpx;
opacity: 1; opacity: 1;
background: url('@/static/assets/矩形 197@1x.png');
} }
.borderClass { .borderClass {
width: 100px; width: 200rpx;
height: 100px; height: 200rpx;
background-color: transparent; background-color: transparent;
margin: 20px; margin: 40rpx;
} }
.sort-text { .sort-text {
font-family: Source Han Sans; font-family: Source Han Sans;
font-size: 12px; font-size: 24rpx;
font-weight: 500; font-weight: 500;
line-height: 12px; line-height: 24rpx;
text-align: center; text-align: center;
letter-spacing: 0em; letter-spacing: 0em;
...@@ -111,26 +101,26 @@ ...@@ -111,26 +101,26 @@
} }
.product-page { .product-page {
position: relative; position: relative;
width: 355px; width: 710rpx;
height: 371px; height: 742rpx;
border-radius: 8px; border-radius: 16rpx;
opacity: 1; opacity: 1;
background: #ffffff; background: #ffffff;
top: 210px; top: 420rpx;
left: 10px; left: 20rpx;
} }
.page-title { .page-title {
position: relative; position: relative;
left: 10px; left: 20rpx;
top: 10px; top: 20rpx;
width: 56px; width: 112rpx;
height: 14px; height: 28rpx;
opacity: 1; opacity: 1;
font-family: Source Han Sans; font-family: Source Han Sans;
font-size: 14px; font-size: 28rpx;
font-weight: 500; font-weight: 500;
line-height: 14px; line-height: 28rpx;
text-align: center; text-align: center;
letter-spacing: 0em; letter-spacing: 0em;
...@@ -139,17 +129,17 @@ ...@@ -139,17 +129,17 @@
color: #3d3d3d; color: #3d3d3d;
} }
.main-img { .main-img {
width: 335px; width: 670rpx;
height: 181px; height: 362rpx;
border-radius: 8px; border-radius: 16rpx;
opacity: 1; opacity: 1;
margin-top: 20px; margin-top: 40rpx;
} }
.detail-title { .detail-title {
font-family: Source Han Sans; font-family: Source Han Sans;
font-size: 12px; font-size: 24rpx;
font-weight: 500; font-weight: 500;
line-height: 14px; line-height: 28rpx;
letter-spacing: 0em; letter-spacing: 0em;
font-variation-settings: 'opsz' auto; font-variation-settings: 'opsz' auto;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment