/* 宝贝样式 */
|
|
/* 双排样式 */
|
.even-commodity {
|
position: relative;
|
width: calc(50% - 10px);
|
display: inline-block;
|
background: #f7f7f7;
|
padding: 0;
|
margin: 16px 0 0 0;
|
border: none;
|
border-radius: 6px;
|
box-sizing: border-box;
|
}
|
|
.commodity-group .even-commodity:nth-child(1),
|
.commodity-group .even-commodity:nth-child(2) {
|
margin-top: 0;
|
}
|
|
.commodity-group .even-commodity:nth-child(odd) {
|
margin-right: 10px;
|
}
|
|
.commodity-group .even-commodity:nth-child(even) {
|
margin-left: 10px;
|
}
|
|
.even-commodity img {
|
width: 100%;
|
height: 100%;
|
border-radius: 6px 6px 0 0;
|
}
|
|
.commodity-details {
|
padding: 1rem;
|
}
|
|
.details-title {
|
width: 100%;
|
line-height: 1;
|
font-size: 14px;
|
color: #333333;
|
text-align: left;
|
margin-bottom: 1rem;
|
display: block;
|
word-wrap: normal;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
overflow: hidden;
|
}
|
|
.commodity-message {
|
display: flex;
|
justify-content: space-between;
|
}
|
|
.message-left {
|
display: inline-flex;
|
flex-direction: column;
|
text-align: left;
|
}
|
|
.message-left>span>span:first-child {
|
font-size: 14px;
|
color: #999999;
|
padding-right: .5rem;
|
}
|
|
.message-left>span>span:last-child {
|
font-size: 1.8rem;
|
font-weight: 600;
|
color: #EF6262;
|
}
|
|
.message-right {
|
display: inline-flex;
|
justify-content: space-between;
|
flex-direction: column;
|
}
|
|
.message-right>span:first-child {
|
font-size: 14px;
|
color: #999999;
|
}
|
|
|
/* 单排样式一 */
|
.single-content-one {
|
width: 60%;
|
margin: 0 auto;
|
}
|
|
.single-info-one {
|
position: relative;
|
background: #F7F7F7;
|
margin-bottom: 16px;
|
border-radius: 6px;
|
}
|
|
.single-info-one:last-child {
|
margin-bottom: 0;
|
}
|
|
.single-info-one>img {
|
width: 100%;
|
border-radius: 6px 6px 0 0;
|
display: block;
|
}
|
|
.single-details-one {
|
padding: 1rem;
|
}
|
|
.single-title-one {
|
width: 100%;
|
line-height: 1;
|
font-size: 14px;
|
color: #333333;
|
text-align: left;
|
padding-bottom: 1rem;
|
display: block;
|
word-wrap: normal;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
overflow: hidden;
|
}
|
|
.single-coupon-one {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 1rem;
|
}
|
|
.single-coupon-one>span:last-child {
|
font-size: 14px;
|
color: #999999;
|
}
|
|
.single-message-one {
|
display: flex;
|
justify-content: space-between;
|
}
|
|
.single-message-one>span>span:last-child {
|
font-size: 1.8rem;
|
font-weight: 600;
|
color: #EF6262;
|
}
|
|
|
/* 单排样式二 */
|
.single-content {
|
width: 80%;
|
margin: 0 auto;
|
}
|
|
.single-info {
|
position: relative;
|
display: flex;
|
background: #F7F7F7;
|
margin-bottom: 16px;
|
border-radius: 6px;
|
}
|
|
.single-info:last-child {
|
margin-bottom: 0;
|
}
|
|
.single-info>img {
|
width: 140px;
|
height: 140px;
|
border-radius: 6px 0 0 6px;
|
}
|
|
.single-details-two {
|
width: calc(100% - 140px);
|
display: flex;
|
align-content: space-between;
|
flex-wrap: wrap;
|
padding: 1rem;
|
}
|
|
.single-title-two {
|
width: 100%;
|
font-size: 14px;
|
color: #333333;
|
text-align: left;
|
display: -webkit-box;
|
-webkit-line-clamp: 1;
|
-webkit-box-orient: vertical;
|
text-overflow: ellipsis;
|
overflow: hidden;
|
}
|
|
.single-coupon-two {
|
width: 100%;
|
font-size: 14px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
.single-coupon-two>span:last-child {
|
color: #999999;
|
}
|
|
.single-couponmoney-two {
|
position: relative;
|
color: #ffffff;
|
background: linear-gradient(85deg, #f75f2e 0%, #ef6262 100%);
|
padding: .2rem 1rem;
|
border-radius: 4px;
|
}
|
|
.single-message-two {
|
width: 100%;
|
text-align: left;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
.single-message-two>span>span:first-child {
|
font-size: 14px;
|
color: #999999;
|
}
|
|
.single-message-two>span>span:last-child {
|
font-size: 2rem;
|
font-weight: 600;
|
color: #ef6262;
|
}
|
|
.single-container .single-info:hover .commodity-remove {
|
display: flex;
|
}
|
|
.adaptive-picture {
|
position: relative;
|
width: 100%;
|
height: 0;
|
padding-bottom: 100%;
|
}
|
|
.adaptive-picture>img {
|
position: absolute;
|
left: 0;
|
width: 100%;
|
height: 100%;
|
}
|
|
|
|
|
.coupon-style {
|
position: relative;
|
width: 80px;
|
height: 26px;
|
line-height: 26px;
|
font-size: 14px;
|
color: #ffffff;
|
background: linear-gradient(85deg, #f75f2e 0%, #ef6262 100%);
|
padding: 0 .5rem;
|
display: inline-flex;
|
border-radius: 4px;
|
}
|
|
.coupon-style::before {
|
content: "";
|
position: absolute;
|
left: -6px;
|
top: calc(50% - 6px);
|
width: 12px;
|
height: 12px;
|
background: #f7f7f7;
|
border-radius: 50%;
|
}
|
|
.coupon-style::after {
|
content: "";
|
position: absolute;
|
right: -6px;
|
top: calc(50% - 6px);
|
width: 12px;
|
height: 12px;
|
background: #f7f7f7;
|
border-radius: 50%;
|
}
|
|
.coupon-style>span:first-child {
|
width: 26px;
|
display: inline-flex;
|
justify-content: center;
|
}
|
|
.coupon-style>span:first-child::after {
|
content: "";
|
position: absolute;
|
left: 32px;
|
top: calc(50% - 7px);
|
width: 1px;
|
height: 14px;
|
background: #ffffff;
|
}
|
|
.coupon-style>span:last-child {
|
width: calc(100% - 26px);
|
display: inline-flex;
|
justify-content: center;
|
}
|
|
|
@media screen and (max-width: 760px) {
|
.even-commodity {
|
width: calc(50% - 5px);
|
}
|
|
.commodity-group .even-commodity:nth-child(odd) {
|
margin-right: 5px;
|
}
|
|
.commodity-group .even-commodity:nth-child(even) {
|
margin-left: 5px;
|
}
|
|
.commodity-message {
|
align-items: center;
|
margin-bottom: 1rem;
|
}
|
|
.single-content {
|
width: 100%;
|
}
|
}
|
|
|
/* 移动端 */
|
.coupon-box {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
.coupon-box .coupon-style {
|
width: 64px;
|
}
|
|
.commodity-view {
|
font-size: 12px;
|
color: #FFFFFF;
|
background: linear-gradient(90deg, #f75f2e 0%, #ef6262 100%);
|
padding: 5px 8px;
|
border-radius: 4px;
|
cursor: pointer;
|
}
|
|
.mobile-coupon {
|
font-size: 12px;
|
color: #999999;
|
}
|
|
.mobile-price {
|
font-size: 14px;
|
color: #FF3C00;
|
}
|
|
.mobile-sold {
|
font-size: 12px;
|
color: #999999;
|
}
|
|
|
body img {
|
width: 100%;
|
margin: auto;
|
}
|
|
body p img {
|
display: block;
|
}
|
|
.commodity-info img,
|
.single-info img,
|
.single-info-one img {
|
display: block;
|
}
|
|
.article-page-write p {
|
color: #635959;
|
font-size: 14px;
|
line-height: 32px;
|
margin: 0;
|
text-align: justify;
|
}
|
|
.article-container {
|
overflow-y: auto;
|
-webkit-overflow-scrolling: touch;
|
word-break: break-all;
|
}
|
|
.article-page-banner {
|
width: 100%;
|
display: block;
|
}
|
|
.article-page-write {
|
background: #fff;
|
padding: 1rem 1.6rem;
|
}
|
|
.article-long-title {
|
font-size: 2.4rem;
|
color: #3c2b2a;
|
margin: 16px 0;
|
}
|
|
.article-message {
|
font-size: 1.6rem;
|
color: #999;
|
}
|
|
.headinfo {
|
display: flex;
|
justify-content: space-between;
|
}
|
|
.headinfo>span {
|
display: inline-flex;
|
align-items: center;
|
}
|
|
.head-image {
|
margin: 0 6px 0 0;
|
border-radius: 50%;
|
width: 36px;
|
height: 36px;
|
padding: 0;
|
border: 1px solid #eee;
|
}
|
|
.personal {
|
display: inline-flex;
|
align-items: center;
|
}
|
|
.personal>span {
|
font-size: 14px;
|
color: #635959;
|
margin-right: 1rem;
|
}
|
|
.preview i {
|
font-size: 18px;
|
color: #999;
|
margin-right: 4px
|
}
|
|
hr {
|
border: 1px solid #857d7d;
|
border-top: 0;
|
width: 46px;
|
margin: 24px 0 38px 0;
|
}
|
|
.article-short-title {
|
font-size: 14px;
|
color: #635959;
|
line-height: 22px;
|
letter-spacing: 1px;
|
}
|
|
.article-short-title span {
|
color: #797171;
|
}
|
|
.article-newpage-write {
|
margin-top: 2.4rem;
|
}
|
|
.article-newpage-write img {
|
width: 100% !important;
|
height: auto !important;
|
}
|
|
.single-info img {
|
width: 118px !important;
|
height: 118px !important;
|
}
|
|
a {
|
text-decoration: none;
|
}
|
|
.shadow {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
position: absolute;
|
top: 0;
|
left: 0;
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
}
|
|
.shadowtext {
|
color: #fff;
|
width: 100px;
|
height: 100px;
|
border-radius: 50%;
|
background: rgba(83, 64, 64, .6);
|
display: inline-flex;
|
justify-content: center;
|
align-items: center;
|
font-weight: 600;
|
font-size: 22px;
|
letter-spacing: 1px;
|
display: none;
|
z-index: 10;
|
}
|
|
.single-info .commodity-info {
|
margin: 1rem 0;
|
}
|
|
.article-newpage-write>div {
|
color: #635959;
|
font-size: 14px;
|
line-height: 24px;
|
margin: 0;
|
text-align: justify;
|
}
|
|
.article-newpage-write .am-g,
|
.article-newpage-write .single-content,
|
.article-newpage-write .single-content-one {
|
line-height: normal;
|
margin: 0 auto;
|
}
|
|
.am-g {
|
width: 100% !important;
|
}
|
|
.am-g .commodity-message {
|
padding-bottom: 0 !important;
|
}
|
|
.commodity-list-btn,
|
.return-page {
|
width: 50px;
|
height: 50px;
|
color: #fff;
|
background: rgba(255, 95, 74, .8);
|
font-size: 1.8rem;
|
border-radius: 1000px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.commodity-modal {
|
position: absolute;
|
top: 0;
|
left: 0;
|
width: 100%;
|
height: 100%;
|
z-index: 1002;
|
background: rgba(0, 0, 0, .4);
|
display: none;
|
}
|
|
.commodity-content {
|
position: absolute;
|
bottom: -100%;
|
width: 100%;
|
padding: 1.5rem;
|
background: rgba(255, 255, 255, .9);
|
box-sizing: border-box;
|
border-top-left-radius: 1rem;
|
border-top-right-radius: 1rem;
|
z-index: 1005;
|
display: none;
|
}
|
|
.commodity-content header {
|
position: relative;
|
padding-bottom: 1.5rem
|
}
|
|
.commodity-content header span {
|
font-size: 2rem;
|
}
|
|
.commodity-list {
|
height: 380px;
|
overflow-y: scroll;
|
}
|
|
.commodity-item {
|
display: flex;
|
background: #fff;
|
border-radius: 6px;
|
margin-bottom: 1rem;
|
}
|
|
.commodity-item:last-child {
|
margin-bottom: 0
|
}
|
|
.commodity-img {
|
width: 100px;
|
height: 100px;
|
border-top-left-radius: 6px;
|
border-bottom-left-radius: 6px
|
}
|
|
.commodity-item-info {
|
display: inline-flex;
|
flex-direction: column;
|
justify-content: space-around;
|
width: calc(100% - 100px);
|
}
|
|
.commodity-title {
|
width: 100%;
|
font-size: 2rem;
|
color: #333;
|
display: -webkit-box;
|
-webkit-line-clamp: 1;
|
-webkit-box-orient: vertical;
|
text-align: ellipsis;
|
overflow: hidden;
|
}
|
|
.commodity-item-price {
|
font-size: 1.8rem;
|
color: #635959;
|
}
|
|
.commodity-bottom {
|
width: 100%;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
font-size: 1.5rem;
|
}
|
|
.commodity-couponmoney {
|
border: 1px solid #ff3c00;
|
color: #ff3c00;
|
padding: 0 3px;
|
}
|
|
.commodity-ticket {
|
border-right: 1px dashed #ff3c00;
|
padding-right: 3px;
|
}
|
|
.commodity-sale {
|
color: #999;
|
}
|
|
.other-list>span {
|
position: relative;
|
background: rgba(255, 95, 74, .8);
|
width: 50px;
|
height: 50px;
|
border-radius: 1000px;
|
display: inline-flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
}
|
|
.other-list {
|
display: flex;
|
margin-top: 1rem;
|
}
|
|
.like i {
|
font-size: 22px;
|
color: #fff;
|
}
|
|
.like-num {
|
color: #fff;
|
font-size: 14px;
|
}
|
|
.return-page {
|
margin-top: 1rem;
|
}
|
|
.return-page a {
|
color: #fff !important;
|
}
|
|
.end {
|
position: relative;
|
width: 100%;
|
background: #FFF url(http://img-haodanku-com.cdn.fudaiapp.com/Fnc6K2cd4bpMYJlyDAI5JLJtsTM5) no-repeat;
|
background-size: 100%;
|
background-position: bottom left;
|
}
|
|
.end-content {
|
text-align: center;
|
padding-top: 3rem;
|
}
|
|
.end-content img {
|
width: 90px;
|
height: 90px;
|
border-radius: 1000px;
|
display: block;
|
}
|
|
.end-content>span {
|
font-size: 14px;
|
color: #666;
|
margin: 12px 0;
|
display: block;
|
text-align: center;
|
letter-spacing: 1px;
|
}
|
|
.homepage {
|
font-size: 14px;
|
color: #f74d61;
|
display: inline-flex;
|
align-items: center;
|
padding: 4px 16px;
|
margin-bottom: 12px;
|
border: 1px solid #f74d61;
|
border-radius: 1000px;
|
cursor: pointer;
|
}
|
|
.homepage>.iconfont {
|
position: relative;
|
top: 1px;
|
font-size: 14px;
|
margin-right: 2px;
|
}
|
|
.banner {
|
width: 100%;
|
overflow: hidden;
|
}
|
|
.banner_inner {
|
width: 100%;
|
height: 140px;
|
}
|
|
.banner_inner>.swiper-container {
|
width: 100%;
|
height: 140px;
|
}
|
|
.banner_inner>.swiper-container>.swiper-wrapper>.swiper-slide {
|
width: 100%;
|
height: 140px;
|
}
|
|
.banner_inner>.swiper-container>.swiper-wrapper>.swiper-slide>img {
|
display: block;
|
width: 100%;
|
height: 100%;
|
}
|
|
.banner_inner>.swiper-container-horizontal>.swiper-pagination-bullets,
|
.swiper-pagination-custom,
|
.swiper-pagination-fraction {
|
bottom: 0px;
|
left: 0;
|
width: 100%;
|
}
|
|
.banner_inner>.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
|
width: 10px;
|
height: 2px;
|
display: inline-block;
|
border-radius: 2px;
|
background: #999999;
|
opacity: 1;
|
}
|
|
.banner_inner>.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active {
|
opacity: 1;
|
background: #fff;
|
}
|
|
.talentinfo {
|
width: 100%;
|
display: flex;
|
justify-content: space-between;
|
padding: 0 15px;
|
box-sizing: border-box;
|
overflow: hidden;
|
margin-top: 21px;
|
}
|
|
.talentinfo_l {
|
flex: 1;
|
display: flex;
|
}
|
|
.talentinfo_l .head_img {
|
width: 45px;
|
height: 45px;
|
border-radius: 50%;
|
|
}
|
|
.talentinfo_l .head_img img {
|
width: 45px;
|
height: 45px;
|
border-radius: 50%;
|
|
}
|
|
.talentinfo_l .info {
|
margin-left: 8px;
|
}
|
|
.talentinfo_l .info div {
|
width: auto;
|
height: 13px;
|
font-size: 12px;
|
font-family: PingFang SC;
|
font-weight: 500;
|
color: #333333;
|
line-height: 13px;
|
margin-top: 5px;
|
}
|
|
.talentinfo_l .info div:last-child {
|
margin-top: 8px;
|
color: #999;
|
}
|
|
.talentinfo_r {
|
display: flex;
|
}
|
|
.talentinfo_r .browse_icon {
|
width: 16px;
|
height: 10px;
|
margin-top: 17.5px;
|
margin-left: auto;
|
}
|
|
.talentinfo_r .browse_icon img {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
|
.talentinfo_r .browse_amount {
|
width: auto;
|
height: 45px;
|
font-size: 12px;
|
font-family: PingFang SC;
|
font-weight: 400;
|
color: #999999;
|
line-height: 45px;
|
}
|
