fe / YOHO-ACTIVITY-PHP · Commits

Go to a project

Authored by Lynnic
Commit b99154fa800fa425a84dfbdc8b732c016c3bea21 1 parent e833f3b8

fixed bugs in goods detail page

Inline Side-by-side
Showing 7 changed files with 133 additions and 81 deletions
... ... @@ -1243,6 +1243,6 @@
'cartInfo' : {
'numInCart' : 3,
'goodsInstore' : 0,
'isCollect':true
'isCollect':true//
}
}
... ...
.goods-comments-page {
.goods-comments {
.comment-item {
border: 1px solid $borderC;
border-bottom: 1px solid $borderC;
padding: 0 pxToRem(28px);
.user-name {
font-size: pxToRem(24px);
... ... @@ -44,7 +44,8 @@
height: pxToRem(120px);
background-color: #ffffff;
i,
span {
span,
a {
line-height: pxToRem(120px);
font-size: pxToRem(28px);
color: $mainFontC;
... ...
... ... @@ -30,50 +30,52 @@ $basicBtnC:#eb0313;
left: pxToRem(30px);
right: auto;
}
.tag-container{
.tag-container {
position: absolute;
left: pxToRem(108px);
top: pxToRem(40px);
height: pxToRem(35px);
// width: pxToRem(70px);
color: #fff;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
z-index: 2;
.good-tag{
display: inline-block;
box-sizing: border-box;
margin-left: .5px;
font-size: pxToRem(23px);
text-align: center;
line-height: pxToRem(35px);
padding:0 8px;
}
.new-tag {
background-color: #78dc7e;
color: #fff;
}
.renew-tag {
background-color: #78dc7e;
color: #fff;
}
.sale-tag {
background-color: #ff575c;
color: #fff;
}
.new-festival-tag {
background-color: #000;
color: #fff;
}
.limit-tag {
border: 1px solid #000;
color: #000;
}
.soonSoldOut-tag{
background-color:#ffac5b;
color:#fff;
}
// width: pxToRem(70px);
color: #fff;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
z-index: 2;
.good-tag {
display: inline-block;
box-sizing: border-box;
margin-left: .5px;
font-size: pxToRem(23px);
text-align: center;
line-height: pxToRem(35px);
padding: 0 8px;
}
.new-tag {
background-color: #78dc7e;
color: #fff;
}
.renew-tag {
background-color: #78dc7e;
color: #fff;
}
.sale-tag {
background-color: #ff575c;
color: #fff;
}
.new-festival-tag {
background-color: #000;
color: #fff;
}
.limit-tag {
border: 1px solid #000;
color: #000;
}
.soonSoldOut-tag {
background-color: #ffac5b;
color: #fff;
}
}
.good-detail-page {
overflow: hidden;
background-color: #f0f0f0;
... ... @@ -104,16 +106,16 @@ $basicBtnC:#eb0313;
width: 100%;
// .row {
// display: table-row;
.column {
box-sizing:border-box;
display: table-cell;
padding: pxToRem(16px) pxToRem(12px);
width: 50%;
border: 1px solid #fff;
font-size: pxToRem(24px);
background-color: $tableCellC;
float:left;
}
.column {
box-sizing: border-box;
display: table-cell;
padding: pxToRem(16px) pxToRem(12px);
width: 50%;
border: 1px solid #fff;
font-size: pxToRem(24px);
background-color: $tableCellC;
float: left;
}
// }
}
}
... ... @@ -136,15 +138,15 @@ $basicBtnC:#eb0313;
position: absolute;
z-index: 2;
bottom: pxToRem(40px);
.pagination-inner{
span{
.pagination-inner {
span {
background-color: #b0b0b0;
}
.swiper-pagination-bullet {
margin-right: 2px;
}
.swiper-pagination-bullet-active {
background-color: #000 ;
background-color: #000;
}
}
}
... ... @@ -227,8 +229,45 @@ $basicBtnC:#eb0313;
vertical-align: middle;
}
}
.vip-level {
box-sizing: box-border;
padding-left: pxToRem(28px);
padding-right: pxToRem(28px);
min-height: pxToRem(88px);
background-color: #fff;
.icons-item {
float: left;
width: 33.3%;
height: pxToRem(88px);
span {
display: inline-block;
line-height: pxToRem(88px);
}
.vip-img {
padding-right: pxToRem(22px);
.img {
width: pxToRem(53px);
height: pxToRem(32px);
}
&:nth-child(3n-3) .img {
background: image-url('product/silver.png') no-repeat;
}
&:nth-child(3n-2) .img {
background: image-url('product/golden.png') no-repeat;
}
&:nth-child(3n-1) .img {
background: image-url('product/platinum.png') no-repeat;
}
}
&:first-child {
float: left;
}
&:last-child {
float: right;
}
}
}
.vipLevel {
width: 100%;
box-sizing: border-box;
background-color: #fff;
display: table;
... ... @@ -242,25 +281,24 @@ $basicBtnC:#eb0313;
display: table-cell;
vertical-align: middle;
}
.vip-img{
.vip-img {
padding-right: pxToRem(22px);
.img{
width: pxToRem(52px);
height: pxToRem(32px);
.img {
width: pxToRem(53px);
height: pxToRem(33px);
}
&:nth-child(3n-3) .img{
&:nth-child(3n-3) .img {
background: image-url('product/silver.png') no-repeat;
}
&:nth-child(3n-2) .img{
&:nth-child(3n-2) .img {
background: image-url('product/golden.png') no-repeat;
}
&:nth-child(3n-1) .img{
&:nth-child(3n-1) .img {
background: image-url('product/platinum.png') no-repeat;
}
}
.vip-price {
padding-right: pxToRem(55px);
padding-right: pxToRem(52px);
}
.vip-price:last-child {
padding-right: 0;
... ... @@ -295,7 +333,6 @@ $basicBtnC:#eb0313;
.goodsDiscount {
text-indent: pxToRem(-14px);
}
.enter-store {
min-height: pxToRem(100px);
display: table;
... ... @@ -327,7 +364,6 @@ $basicBtnC:#eb0313;
}
}
}
//底部固定栏
.cart-bar {
position: relative;
... ... @@ -350,10 +386,10 @@ $basicBtnC:#eb0313;
font-size: pxToRem(34px);
color: #ccc
}
&.favorite.liked{
color:$basicBtnC;;
&.favorite.liked {
color: $basicBtnC;
;
}
&.addto-cart,
&.sold-out {
height: pxToRem(80px);
... ... @@ -382,11 +418,10 @@ $basicBtnC:#eb0313;
font-size: pxToRem(24px);
}
}
.recommend-for-you{
.recommend-for-you {
margin-bottom: pxToRem(120px);
}
}
@import "comments-consults";
@import "product-description";
... ...
... ... @@ -3,7 +3,7 @@
<div class="goto-consult">
<i class="iconfont consult-logo">&#xe639;</i>
<span>我要咨询</span>
<i class="iconfont enter-consult-page">&#xe604;</i>
<a href="/product/detail/consultform" class="iconfont enter-consult-page">&#xe604;</a>
</div>
{{# consults}}
<div class="goods-consults">
... ...
... ... @@ -52,6 +52,19 @@
{{/ periodOfMarket}}
</div>
<!-- {{# vipLevel}}
<ul class="vip-level clearfix">
{{# list}}
<li class="icons-item">
<span class="vip-img">
<div class="img" alt="" style="background-size:cover;"></div>
</span>
<span class="vip-price">{{text}}</span>
</li>
{{/ list}}
</ul>
{{/vipLevel}} -->
{{# vipLevel}}
<div class="vipLevel">
{{# list}}
... ... @@ -118,11 +131,8 @@
{{else}}
<a href="" class="sold-out">已售罄</a>
{{/if}}
{{#if isCollect}}
<a href="#" id="likeBtn" class="favorite iconfont liked">&#xe605;</a>
{{else}}
<a href="" id="likeBtn" class="favorite iconfont">&#xe605;</a>
{{/if}}
<a href="#" id="likeBtn" class="favorite iconfont {{#isCollect}}liked{{/isCollect}}">&#xe605;</a>
</div>
{{/cartInfo}}
... ...
... ... @@ -166,7 +166,13 @@
{{!-- 商品详情评论 --}}
{{#if goodsCommentsPage}}
<script>
seajs.use('js/product/detail/comments-consults');
seajs.use('js/product/detail/loadmore');
</script>
{{/if}}
{{!-- 商品详情咨询 --}}
{{#if goodsConsultsPage}}
<script>
seajs.use('js/product/detail/loadmore');
</script>
{{/if}}
{{!-- 品类 --}}
... ...
... ... @@ -59,7 +59,7 @@
<span class="iconfont">&#xe63c;</span>暂无咨询
</div>
<div class="consult-content-footer">
<a href="{{link}}">
<a href="/consultform">
我要咨询
<span class="iconfont">&#xe604;</span></a>
</div>
... ...