product_platform/yxt-yythmall-ui-miniprogram
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

我的菜窖样式修改

Browse Source
This commit is contained in:
yxt_njy
2024-01-20 16:43:14 +08:00
parent 01875433da
commit 93492d03f1
1 changed files with 56 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
pages/home/myCellar.vue
View File

@@ -11,33 +11,28 @@
</view>
<view style="background: #fff;flex-flow: 1; height: calc(100vh - 65vw - 50px);
width: 100%; margin-top: -13vw;
border-radius: 25px;display: flex;flex-direction: column; box-sizing: border-box;">
<view style="background: #fff; height: calc(100vh - 45px - 50vw);width: 100%; border-radius: 15px;display: flex;flex-direction: column; box-sizing: border-box;margin-top: -15px;box-sizing: border-box;">
<view style="display: flex;flex-direction: row;height: 25px; width: 100%; flex-shrink: 0;">
<!-- <view style="display: flex;flex-direction: row;height: 25px; width: 100%; flex-shrink: 0;">
<view style="width: 20%;background: #F7F7F7;border-top-left-radius: 25px;"></view>
<view style="width: 80%;background: #fff; border-top-right-radius: 25px;"></view>
</view>
</view> -->
<view style="display: flex;flex-direction: row;min-height: calc(100% - 80px); ">
<view style="display: flex;flex-direction: column;width: 21%;background: #F7F7F7; ">
<text style="font-weight: 600;font-family: sans-serif;
<view class="center">
<!-- 左侧菜单 -->
<view style="width: 22%;display: flex;flex-direction: column;overflow-y: auto;padding-top: 10px;">
<!-- <text style="font-weight: 600;font-family: sans-serif;
color: #333;
font-size: 15px;
padding-top: 15px;
padding-bottom: 15px;
margin-top: -20px;
text-align: center;">菜窖分类</text>
text-align: center;">菜窖分类</text> -->
<scroll-view scroll-y="true" style="height: 100%; width: 100%;border-bottom-left-radius: 25px;"
<!-- <scroll-view scroll-y="true" style="height: 100%; width: 100%;border-bottom-left-radius: 25px;"
:scroll-top="scrollLeftTop" bindscrolltoupper="upper" bindscrolltolower="lower"
:show-scrollbar="false" :enhanced="true" bindscroll="scroll">
<view
style="width: 100%;height: 100%;; display: flex;flex-direction: column; background: #F7F7F7;border-bottom-left-radius: 25px;">
<view v-for="(item,index) in data" @click="labelClick(index,item)"
@@ -54,11 +49,18 @@
</view>
</view>
</scroll-view>
</view>
<view style="width: 80%;min-height: calc(100% - 80px); display: flex;flex-direction: column;
margin-left: 10px; margin-right: 10px; margin-top: -10px; ">
</scroll-view> -->
<!-- 左侧菜单列表 -->
<view style="width: 100%;display: flex;flex-direction: column; ">
<view v-for="(item,index) in data" @click="labelClick(index,item)" style="display: flex;flex-direction: column;justify-content: center;">
<text class="label" :class="{'label2':selectIndex==index}">{{item.name}}</text>
</view>
</view>
</view>
<view style="width: 78%;background-color: #fff;overflow-y: auto;">
<scroll-view scroll-y="true" style="height: 100%; width: 100%;" bindscrolltoupper="upper"
bindscrolltolower="lower" bindscroll="scroll" :show-scrollbar="false"
:scroll-top="scrollRightTop" :enhanced="true">
@@ -532,7 +534,7 @@
.top {
width: 100vw;
/* height: 126.66vw; */
height: 75vw;
height: 50vw;
/* 加载背景图 */
background-image: url(https://supervise.yxtsoft.com/lpk/image/clound_bj1.png);
/* background-image: url(../../static/clound_bj1.png); */
@@ -540,7 +542,7 @@
background-size: 100% 100%;
}
.label {
/* .label {
background: #fff;
color: #FF9900;
font-size: 13px;
@@ -548,7 +550,6 @@
padding-bottom: 15px;
text-align: center;
}
.label2 {
background: #FF9900;
@@ -557,6 +558,39 @@
padding-top: 15px;
padding-bottom: 15px;
text-align: center;
} */
.label {
color: #191919;
font-size: 12px;
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
padding-top: 7px;
padding-bottom: 7px;
margin-left: 5px;
}
.label2 {
background: #FFF;
color: #FFF;
background-color: #FF9900;
font-size: 12px;
margin-top: 10px;
margin-bottom: 10px;
padding-top: 7px;
padding-bottom: 7px;
text-align: center;
font-weight: bold;
border-radius: 20px;
margin-left: 5px;
}
.center {
display: flex;
flex-direction: row;
flex: 1;
background-color: #f7f7f7;
border-radius: 15px;
overflow: hidden;
min-width: 0;
}
/* 弹窗样式 */