首页完成
This commit is contained in:
parent
e47bb87558
commit
1fee501560
4
app.wxss
4
app.wxss
@ -9,7 +9,7 @@
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
line-height: 1; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
@ -164,7 +164,7 @@ select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
line-height: 1; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
|
8
components/index/list/commodity/index.js
Normal file
8
components/index/list/commodity/index.js
Normal file
@ -0,0 +1,8 @@
|
||||
Component({
|
||||
properties: {
|
||||
},
|
||||
data: {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
})
|
3
components/index/list/commodity/index.json
Normal file
3
components/index/list/commodity/index.json
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
49
components/index/list/commodity/index.scss
Normal file
49
components/index/list/commodity/index.scss
Normal file
@ -0,0 +1,49 @@
|
||||
.commodity {
|
||||
width: 623rpx;
|
||||
height: 143rpx;
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.content {
|
||||
width: 614rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-shadow: 0 0 24rpx 0 rgba(227, 227, 227, 0.4);
|
||||
.imgthumb {
|
||||
width: 105rpx;
|
||||
height: 105rpx;
|
||||
margin-left: 40rpx;
|
||||
background-color: #333;
|
||||
}
|
||||
.introduce {
|
||||
width: 410rpx;
|
||||
margin-left: 40rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> text {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
margin-bottom: 22rpx;
|
||||
}
|
||||
> view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
> text:first-child {
|
||||
font-size: 30rpx;
|
||||
color: #dec499;
|
||||
}
|
||||
> text:last-child {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.decorate {
|
||||
width: 9rpx;
|
||||
height: 102rpx;
|
||||
background-color: #3fb66e;
|
||||
}
|
||||
}
|
13
components/index/list/commodity/index.wxml
Normal file
13
components/index/list/commodity/index.wxml
Normal file
@ -0,0 +1,13 @@
|
||||
<view class="commodity">
|
||||
<view class="content">
|
||||
<image class="imgthumb "></image>
|
||||
<view class="introduce">
|
||||
<text>产品名称产品名称产品名称产品名称产品名称产品名称产品名称</text>
|
||||
<view>
|
||||
<text>¥657</text>
|
||||
<text>加入购物车</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="decorate"></view>
|
||||
</view>
|
1
components/index/list/commodity/index.wxss
Normal file
1
components/index/list/commodity/index.wxss
Normal file
@ -0,0 +1 @@
|
||||
.commodity{width:623rpx;height:143rpx;margin-top:32rpx;display:flex;align-items:center}.commodity .content{width:614rpx;height:100%;display:flex;align-items:center;box-shadow:0 0 24rpx 0 rgba(227,227,227,0.4)}.commodity .content .imgthumb{width:105rpx;height:105rpx;margin-left:40rpx;background-color:#333}.commodity .content .introduce{width:410rpx;margin-left:40rpx;display:flex;flex-direction:column}.commodity .content .introduce>text{font-size:26rpx;color:#333;margin-bottom:22rpx}.commodity .content .introduce>view{display:flex;align-items:center;justify-content:space-between}.commodity .content .introduce>view>text:first-child{font-size:30rpx;color:#dec499}.commodity .content .introduce>view>text:last-child{font-size:22rpx;color:#999}.commodity .decorate{width:9rpx;height:102rpx;background-color:#3fb66e}
|
8
components/index/list/index.js
Normal file
8
components/index/list/index.js
Normal file
@ -0,0 +1,8 @@
|
||||
Component({
|
||||
properties: {
|
||||
},
|
||||
data: {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
})
|
6
components/index/list/index.json
Normal file
6
components/index/list/index.json
Normal file
@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"commodity":"./commodity/index"
|
||||
}
|
||||
}
|
12
components/index/list/index.scss
Normal file
12
components/index/list/index.scss
Normal file
@ -0,0 +1,12 @@
|
||||
.list {
|
||||
width: 623rpx;
|
||||
margin-top: 36rpx;
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
margin-left: 32rpx;
|
||||
// margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
}
|
4
components/index/list/index.wxml
Normal file
4
components/index/list/index.wxml
Normal file
@ -0,0 +1,4 @@
|
||||
<view class="list">
|
||||
<text class="title">热门商品</text>
|
||||
<commodity></commodity>
|
||||
</view>
|
1
components/index/list/index.wxss
Normal file
1
components/index/list/index.wxss
Normal file
@ -0,0 +1 @@
|
||||
.list{width:623rpx;margin-top:36rpx}.list .title{font-size:30rpx;color:#333;font-weight:bold;margin-left:32rpx}
|
8
components/index/search/index.js
Normal file
8
components/index/search/index.js
Normal file
@ -0,0 +1,8 @@
|
||||
Component({
|
||||
properties: {
|
||||
},
|
||||
data: {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
})
|
3
components/index/search/index.json
Normal file
3
components/index/search/index.json
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
23
components/index/search/index.scss
Normal file
23
components/index/search/index.scss
Normal file
@ -0,0 +1,23 @@
|
||||
.search{
|
||||
width: 613rpx;
|
||||
height: 76rpx;
|
||||
margin-top: 30rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 15rpx;
|
||||
display: flex;
|
||||
border:1rpx solid rgba(198,198,198,1);
|
||||
>image{
|
||||
width: 42rpx;
|
||||
height: 42rpx;
|
||||
background-color: #000;
|
||||
margin-left: 40rpx;
|
||||
margin-top: 17rpx;
|
||||
}
|
||||
>input{
|
||||
height: 30rpx;
|
||||
width: 480rpx;
|
||||
margin-top: 25rpx;
|
||||
margin-left: 17rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
4
components/index/search/index.wxml
Normal file
4
components/index/search/index.wxml
Normal file
@ -0,0 +1,4 @@
|
||||
<view class="search">
|
||||
<image></image>
|
||||
<input type="text" placeholder="输入您要搜索的产品" />
|
||||
</view>
|
1
components/index/search/index.wxss
Normal file
1
components/index/search/index.wxss
Normal file
@ -0,0 +1 @@
|
||||
.search{width:613rpx;height:76rpx;margin-top:30rpx;box-sizing:border-box;border-radius:15rpx;display:flex;border:1rpx solid #c6c6c6}.search>image{width:42rpx;height:42rpx;background-color:#000;margin-left:40rpx;margin-top:17rpx}.search>input{height:30rpx;width:480rpx;margin-top:25rpx;margin-left:17rpx;font-size:30rpx}
|
@ -1,3 +1,6 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
"usingComponents": {
|
||||
"search":"../components/index/search/index",
|
||||
"list":"../components/index/list/index"
|
||||
}
|
||||
}
|
@ -1,11 +1,9 @@
|
||||
.box{
|
||||
border-top: #eaeaea solid 1rpx;
|
||||
width: 750rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.search{
|
||||
width: 613px;
|
||||
height: 76px;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
border-top: #eaeaea solid 1rpx;
|
||||
width: 750rpx;
|
||||
// overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
<view class="box">
|
||||
<view class="search">
|
||||
|
||||
</view>
|
||||
<search></search>
|
||||
<list></list>
|
||||
</view>
|
@ -1 +1 @@
|
||||
.box{border-top:#eaeaea solid 1rpx;width:750rpx;overflow:hidden;display:flex;flex-direction:column}.box .search{width:613px;height:76px}
|
||||
.box{border-top:#eaeaea solid 1rpx;width:750rpx;display:flex;align-items:center;flex-direction:column}
|
||||
|
Loading…
Reference in New Issue
Block a user