/** *@description: 商品列表1180px下搜索页的样式 *列表页、new-sale页在此基础上覆盖(index.scss) */ .good-info { margin-bottom: 35px; width: 222px; margin-right: 10px; float: left; //图片 .good-detail-img { width: 100%; height: 300px; position: relative; .good-thumb, img.lazy { display: block; overflow: hidden; width: 100%; height: 100%; } .few-tag { width: 100%; position: absolute; left: 0; height: 16px; line-height: 16px; background: #ffac5b; color: #fff; font-size: 12px; text-align: center; bottom: 0; } } //文本 .good-detail-text { color: #222; font-size: 12px; text-align: left; overflow: hidden; > a { margin-top: 16px; line-height: 1.5; display: block; @include ellipsis(); } > .price { margin-top: 5px; } .brand { a { color: #666; line-height: 1.5; } } .market-price { text-decoration: line-through; color: #999; } } .col-btn { position: absolute; top: 15px; right: 15px; color: #ccc; font-size: 12px; display: none; &.coled { color: #f95b4f; } } .tag-container { font-size: 12px; height: 22px; line-height: 22px; .good-tag { padding: 0 7px; display: block; float: left; margin-right: 3px; &:nth-last-of-type(1) { margin-right: 0; } @each $tag, $tagColor, $tagBackground in (new-tag, #fff, #78dc7d), (renew-tag, #fff, #78dc7e), (new-festival-tag, #fff, #000000), (yep-tag, #fff, #ff565b), (ymp-tag, #fff, #ff565b), (sale-tag, #fff, #ff565b) { &.#{$tag} { color: $tagColor; background: $tagBackground; } } &.limit-tag { color: #4e4e4e; border: 1px solid #4e4e4e; } } } } //弹层 .good-item-wrapper { border: 1px solid #dddddd; padding-left: 20px; padding-top: 18px; padding-right: 20px; position: absolute; background: #fff; display: none; .good-info-main{ float: left; .col-btn { display: block; &:hover { // color: #f95b4f; cursor: pointer; } } } @keyframes slideRight { from { max-width: 0; } to { max-width: 150px; } } .good-select-color { float: left; margin-top: 22px; overflow: hidden; animation: slideRight 600ms 1; ul { display: block; float: left; margin-left: 15px; } li { width: 50px; margin-bottom: 15px; a, img { display: block; overflow: hidden; width: 100%; } } } .good-info { margin-right: 10px; } } /*next page*/ .block-next-page { width: 222px; height: 297px; padding-top: 22px; margin-bottom: 35px; margin-right: 10px; float: left; cursor: pointer; a { display: block; img { width: 100%; height: 100%; display: block; overflow: hidden; } } }