健康模块首页调整样式

This commit is contained in:
2022-02-25 16:51:45 +08:00
parent 76064b3ea2
commit fb3d8ff950
2 changed files with 27 additions and 26 deletions

View File

@@ -136,12 +136,14 @@
.nickname { .nickname {
font-size: $title-size; font-size: $title-size;
color: $text-color; color: $text-color;
padding-bottom: 6rpx; padding-bottom: 6rpx;
span { span {
color: $text-color; color: $text-color;
font-size: $title-size-m +1; font-size: $title-size-m +1;
padding-top: 20rpx; padding-top: $padding - 10;
} }
} }
@@ -150,7 +152,7 @@
color: #Fff; color: #Fff;
text-align: center; text-align: center;
font-size: $title-size-m; font-size: $title-size-m;
padding: 6rpx 20rpx; padding: $padding - 22 $padding - 10;
border-radius: 10rpx; border-radius: 10rpx;
margin-left: 10rpx; margin-left: 10rpx;
} }

View File

@@ -14,7 +14,7 @@
<!-- 头像 --> <!-- 头像 -->
<view class="user" @click="$Router.back()"> <view class="user" @click="$Router.back()">
<u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true" /> <u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true" />
<!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="user.avatar ? user.avatar : require('../../static/imgs/avatar.png')" :lazy-load="true" shape="circle" /> <!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="user.avatar ? user.avatar : require('@/static/imgs/avatar.png')" :lazy-load="true" shape="circle" />
<view class="nickname">{{user.nickname}}</view> --> <view class="nickname">{{user.nickname}}</view> -->
<!-- <u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1"/> --> <!-- <u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1"/> -->
</view> </view>
@@ -42,7 +42,6 @@
<!-- 体重管理模块 --> <!-- 体重管理模块 -->
<view class="weight-manage"> <view class="weight-manage">
<!-- 体重管理 --> <!-- 体重管理 -->
<!-- @click="$Router.push({name:'EssentialInfo'})" -->
<view class="manage">体重管理</view> <view class="manage">体重管理</view>
<!-- 单位:公斤 --> <!-- 单位:公斤 -->
<u-icon class="eye" name="eye" color="#fff" size="14" :bold="true" label="单位 : 公斤" labelPos="left" labelSize="12" labelColor="#fff" space="6" /> <u-icon class="eye" name="eye" color="#fff" size="14" :bold="true" label="单位 : 公斤" labelPos="left" labelSize="12" labelColor="#fff" space="6" />
@@ -81,7 +80,7 @@
</view> </view>
<!-- 健康测评 --> <!-- 健康测评 -->
<u-image <u-image
:src="banner.cover || require('../../static/imgs/health1.png')" :src="banner.cover || require('@/static/imgs/health1.png')"
class="eval-img" class="eval-img"
@click="$Router.push({ name: 'EvaluationList' })" @click="$Router.push({ name: 'EvaluationList' })"
:lazy-load="true" :lazy-load="true"
@@ -101,7 +100,7 @@
千卡 千卡
</view> </view>
</view> </view>
<u-image :src="require('../../static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" /> <u-image class="h-icon" :src="require('@/static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="150rpx" height="150rpx"/>
</view> </view>
<view class="health-2"> <view class="health-2">
<view class="health" @click="$Router.push({ name: 'Drink' })"> <view class="health" @click="$Router.push({ name: 'Drink' })">
@@ -115,7 +114,7 @@
毫升 毫升
</view> </view>
</view> </view>
<u-image :src="require('../../static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="110rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="120rpx" class="h-icon" height="120rpx" />
</view> </view>
<view class="health" @click="$Router.push({ name: 'Weight' })"> <view class="health" @click="$Router.push({ name: 'Weight' })">
<view> <view>
@@ -127,18 +126,18 @@
公斤 公斤
</view> </view>
</view> </view>
<u-image :src="require('../../static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" height="140rpx" class="h-icon" />
</view> </view>
</view> </view>
<!-- 营养管理 --> <!-- 营养管理 -->
<view class="title">营养管理</view> <view class="title">营养管理</view>
<view class="nutrition"> <view class="nutrition">
<view class="--item" @click="$Router.push({ name: 'VipFoods' })"> <view class="--item" @click="$Router.push({ name: 'VipFoods' })">
<u-icon :name="require('../../static/icon/vip.png')" size="20" :bold="true" label="会员专享食谱" labelPos="right" labelSize="16" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/vip.png')" size="20" :bold="true" label="会员专享食谱" labelPos="right" labelSize="16" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
<view class="--item mt20" @click="$Router.push({ name: 'topicIndex' })"> <view class="--item mt20" @click="$Router.push({ name: 'topicIndex' })">
<u-icon :name="require('../../static/icon/helper.png')" size="20" :bold="true" label="营养小助手" labelPos="right" labelSize="16" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/helper.png')" size="20" :bold="true" label="营养小助手" labelPos="right" labelSize="16" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
</view> </view>
@@ -149,7 +148,7 @@
<view class="search" > <view class="search" >
<!-- 头像 --> <!-- 头像 -->
<view class="user" @click="$Router.back()"> <view class="user" @click="$Router.back()">
<!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="require('../../static/imgs/avatar.png')" :lazy-load="true" shape="circle" /> <!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="require('@/static/imgs/avatar.png')" :lazy-load="true" shape="circle" />
<u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1" /> --> <u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1" /> -->
<u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true"/> <u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true"/>
</view> </view>
@@ -201,7 +200,7 @@
</view> </view>
</view> </view>
<!-- 健康测评 --> <!-- 健康测评 -->
<u-image :src="banner.cover || require('../../static/imgs/health1.png')" class="eval-img" @click="Login" :lazy-load="true" radius="10rpx" mode="widthFix" width="100%" /> <u-image :src="banner.cover || require('@/static/imgs/health1.png')" class="eval-img" @click="Login" :lazy-load="true" radius="10rpx" mode="widthFix" width="100%" />
<!-- 健康记录 --> <!-- 健康记录 -->
<view class="title">健康记录</view> <view class="title">健康记录</view>
<view class="health" @click="Login"> <view class="health" @click="Login">
@@ -210,7 +209,7 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" /> <u-image :src="require('@/static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" />
</view> </view>
<view class="health-2"> <view class="health-2">
<view class="health" @click="Login"> <view class="health" @click="Login">
@@ -219,7 +218,7 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="110rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="110rpx" class="h-icon" />
</view> </view>
<view class="health" @click="Login"> <view class="health" @click="Login">
<view> <view>
@@ -227,18 +226,18 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" class="h-icon" />
</view> </view>
</view> </view>
<!-- 营养管理 --> <!-- 营养管理 -->
<view class="title">营养管理</view> <view class="title">营养管理</view>
<view class="nutrition"> <view class="nutrition">
<view class="--item" @click="Login"> <view class="--item" @click="Login">
<u-icon :name="require('../../static/icon/vip.png')" size="24" :bold="true" label="会员专享食谱" labelPos="right" labelSize="17" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/vip.png')" size="24" :bold="true" label="会员专享食谱" labelPos="right" labelSize="17" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
<view class="--item mt20" @click="Login"> <view class="--item mt20" @click="Login">
<u-icon :name="require('../../static/icon/helper.png')" size="24" :bold="true" label="营养小助手" labelPos="right" labelSize="17" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/helper.png')" size="24" :bold="true" label="营养小助手" labelPos="right" labelSize="17" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
</view> </view>
@@ -249,7 +248,7 @@
<view class="search" > <view class="search" >
<!-- 头像 --> <!-- 头像 -->
<view class="user" @click='$Router.back()'> <view class="user" @click='$Router.back()'>
<!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="require('../../static/imgs/avatar.png')" :lazy-load="true" shape="circle" /> <!-- <u-image class="avatar" width="90rpx" height="90rpx" :src="require('@/static/imgs/avatar.png')" :lazy-load="true" shape="circle" />
<u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1" /> --> <u-icon name="arrow-down-fill" color="#525252" size="10" class="downIcon" :bold="true" space="1" /> -->
<u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true"/> <u-icon name="arrow-left" color="#525252" size="22" class="downIcon" :bold="true"/>
</view> </view>
@@ -302,7 +301,7 @@
</view> </view>
<!-- 健康测评 --> <!-- 健康测评 -->
<u-image <u-image
:src="banner.cover || require('../../static/imgs/health1.png')" :src="banner.cover || require('@/static/imgs/health1.png')"
class="eval-img" class="eval-img"
@click="toCreateInfo" @click="toCreateInfo"
:lazy-load="true" :lazy-load="true"
@@ -318,7 +317,7 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" /> <u-image :src="require('@/static/imgs/eat.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" />
</view> </view>
<view class="health-2"> <view class="health-2">
<view class="health" @click="toCreateInfo"> <view class="health" @click="toCreateInfo">
@@ -327,7 +326,7 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="110rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/drink.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="110rpx" class="h-icon" />
</view> </view>
<view class="health" @click="toCreateInfo"> <view class="health" @click="toCreateInfo">
<view> <view>
@@ -335,18 +334,18 @@
<!-- <view class="h-date">--</view> --> <!-- <view class="h-date">--</view> -->
<view class="h-eat"><span>--</span></view> <view class="h-eat"><span>--</span></view>
</view> </view>
<u-image :src="require('../../static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" class="h-icon" /> <u-image :src="require('@/static/imgs/weight.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="140rpx" class="h-icon" />
</view> </view>
</view> </view>
<!-- 营养管理 --> <!-- 营养管理 -->
<view class="title">营养管理</view> <view class="title">营养管理</view>
<view class="nutrition"> <view class="nutrition">
<view class="--item" @click="toCreateInfo"> <view class="--item" @click="toCreateInfo">
<u-icon :name="require('../../static/icon/vip.png')" size="24" :bold="true" label="会员专享食谱" labelPos="right" labelSize="17" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/vip.png')" size="24" :bold="true" label="会员专享食谱" labelPos="right" labelSize="17" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
<view class="--item mt20" @click="toCreateInfo"> <view class="--item mt20" @click="toCreateInfo">
<u-icon :name="require('../../static/icon/helper.png')" size="24" :bold="true" label="营养小助手" labelPos="right" labelSize="17" labelColor="#525252" space="10" /> <u-icon :name="require('@/static/icon/helper.png')" size="24" :bold="true" label="营养小助手" labelPos="right" labelSize="17" labelColor="#525252" space="10" />
<u-icon name="arrow-right" color="#999" /> <u-icon name="arrow-right" color="#999" />
</view> </view>
</view> </view>
@@ -498,7 +497,7 @@ export default {
// 体重管理 // 体重管理
.weight-manage { .weight-manage {
height: 288rpx; height: 288rpx;
background-image: url(../../static/imgs/banner-bg.png); background-image: url(@/static/imgs/banner-bg.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
border-radius: $radius + 1; border-radius: $radius + 1;