xt / xcx-book · Commits

Go to a project

Commit e4ba0e5ec7957cabee6498aa43796e67ab89dbe9

Authored by vking
1 parent cc631333
build: skipped

new 2.0

Inline Side-by-side
Showing 5 changed files with 157 additions and 9 deletions
... ... @@ -14,8 +14,8 @@ page {
/* var属性兼容性 --> https://www.caniuse.com/#feat=css-variables */
/* 标准色 */
--red: #e54d42;
--orange: #f37b1d;
--yellow: #fbbd08;
--orange: #FF7A00;
--yellow: #FFC9AA;
--olive: #8dc63f;
--green: #39b54a;
--cyan: #1cbbb4;
... ... @@ -3796,11 +3796,15 @@ scroll-view.cu-steps .cu-item {
.text-xs {
font-size: 20rpx;
}
.text-22{
font-size: 22rpx;
}
.text-sm {
font-size: 24rpx;
}
.text-26{
font-size: 26rpx;
}
.text-df {
font-size: 28rpx;
}
... ...
<!--components/2.0/seller/card.wxml-->
<text>components/2.0/seller/card.wxml</text>
<view class="view seller padding-sm margin-sm">
<view class="view flex avatar-block">
<view class="view avatar">
<image src="" class="avatar-image" mode="aspectFill" lazy-load></image>
<view class="avatar-txt text-white text-xs text-center">111</view>
</view>
<view class="view detail margin-left-sm flex-treble margin-top-sm">
<view class="view flex align-center justify-between" style="height: 52rpx;">
<view class="title">123{{seller.seller_name}}</view>
<view class="text-gray" style="font-size: 26rpx;">123</view>
</view>
<view class="view flex align-center text-gray margin-top-xs" style="height: 36rpx;">
<view class="caixi">123{{seller.seller_name}}</view>
<view class="renjun flex margin-left-lg align-center">
<view class="text-22">¥</view>
<view class="text-26" style="margin: 0 4rpx;">123</view>
<view class="text-22">/人</view>
</view>
</view>
<view class="view flex align-center margin-top-xs active" style="height: 36rpx;">
<view class="cu-tag line-yellow text-orange view">123</view>
<view class="cu-tag view">123</view>
<view class="cu-tag view">123</view>
<view class="cu-tag view">123</view>
</view>
</view>
</view>
<view class="view flex align-center justify-between margin-top-sm reserve-view">
<view class="view rooms flex-treble flex" style="overflow-x: auto">
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round line-blue text-blue view">123</view>
<view class="cu-tag round view cu-tag-end"></view>
</view>
<view class="view button-view flex justify-end">
<view class="cu-btn bg-blue text-white round reserve-button text-df text-bold view">111</view>
</view>
</view>
</view>
... ...
/* components/2.0/seller/card.wxss */
\ No newline at end of file
/* components/2.0/seller/card.wxss */
@import "../../../colorui/main.wxss";
.seller{
height: 304rpx;
background: #FFFFFF;
box-shadow: 0px 0px 30rpx 0px #E5E5E5;
border-radius: 20rpx;
position: relative;
}
.avatar{
position: relative;
}
.avatar-image{
width: 200rpx;
height: 188rpx;
background: #D8D8D8;
border-radius: 10rpx;
}
.avatar-txt{
background: linear-gradient(180deg, #FFC140 0%, #FFA000 100%);
width: 96rpx;
height: 37rpx;
border-radius: 10rpx 4rpx 20rpx 0px;
position: absolute;
top:0;
left:0;
line-height: 37rpx;
}
.title{
font-size: 38rpx;
font-weight: 600;
height: 52rpx;
line-height: 52rpx;
}
.active .cu-tag{
height: 36rpx;
line-height: 36rpx;
border-radius: 4rpx;
padding: 0 10rpx;
}
.reserve-view .cu-tag{
height: 52rpx;
border-color: #5EB2FF;
padding: 0 20rpx;
line-height: 52rpx;
}
.reserve-view .cu-tag {
margin-right: 20rpx;
margin-left: 0;
}
.cu-tag-end{
}
.button-view{
width: 144rpx;
height: 60rpx;
position: relative;
}
.button-shadow{
width: 82rpx;
height: 60rpx;
background: #FFFFFF;
box-shadow: 0px 0px 20rpx 0px #CCCCCC;
position: absolute;
right:82rpx;
bottom:16rpx;
}
.button-view:before{
position: absolute;
left:0;
top:0rpx;
height: 60rpx;
width: 20rpx;
background: #FFFFFF;
box-shadow: 0px 0px 20rpx 0px #CCCCCC;
content: "";
display: block;
}
.button-view:after{
position: absolute;
left:0;
top:-20rpx;
width: 50rpx;
height: 90rpx;
background-color: #ffffff;
content: "";
display: block;
}
.reserve-button{
width: 124rpx;
height: 56rpx;
background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
border-radius: 28rpx;
z-index: 1;
}
\ No newline at end of file
... ...
... ... @@ -5,7 +5,8 @@
"usingComponents": {
"getpos":"/components/userinfo/getpos",
"a2l":"/components/tips/add-to-lite",
"as-phone":"/components/actionSheet/phone",
"filter-group":"/components/2.0/filter/filter-group"
"filter-group":"/components/2.0/filter/filter-group",
"seller-card":"/components/2.0/seller/card",
"as-phone":"/components/actionSheet/phone"
}
}
\ No newline at end of file
... ...
... ... @@ -16,7 +16,10 @@
style="width: 100%; height: 360rpx;"></map>
<view class="view content" style="height: {{height}}px;">
<filter-group height="{{height}}"></filter-group>
<scroll-view class="view scroll-view" scroll-y="true" bindscroll="scroll" style="width:100%;height: {{height-50}}px;">
<seller-card class="seller-card" seller="{{item}}" wx:for="{{['','','','']}}" wx:key="sellers"></seller-card>
<view class="view" style="height: 192rpx;"></view>
</scroll-view>
</view>
<getpos bindpos="onpos" id="getpos"></getpos>
<view bindtap="moveToLocation" class="view moveToLocation flex align-center justify-center">
... ...