123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403 |
- .page-wrap {
- min-height: 100vh;
- background-color: #F5F5F5;
- padding-bottom: 200rpx;
- .back-btn {
- position: fixed;
- left: 38rpx;
- top: 80rpx;
- width: 52rpx;
- height: 52rpx;
- z-index: 9;
- }
- .swiper-wrap {
- width: 100vw;
- height: 100vw;
- }
- .con-block{
- margin: 24rpx;
- border-radius: 30rpx;
- padding: 24rpx;
- background-color: #fff;
- }
- .salesVolume{
- background: url('https://ld.726p.com/ldyx_static/imgs/huo-bg.png') no-repeat;
- background-size: 100%;
- width: 200rpx;
- line-height: 28rpx;
- color: #FF4040;
- font-size: 24rpx;
- line-height: 54rpx;
- text-align: center;
- padding-left: 16rpx;
- }
- .info-wrap {
- .tp-wrap {
- display: flex;
- align-items: center;
- justify-content: space-between;
- .lt-wrap {
- display: flex;
- align-items: baseline;
- .price-title{
- color: #FF4040;
- font-size: 28rpx;
- line-height: 40rpx;
- }
- .price {
- font-size: 48rpx;
- color: #FF4040;
- font-weight: bold;
- line-height: 66rpx;
- margin-left: 12rpx;
- }
- .price-old {
- margin-left: 16rpx;
- font-size: 24rpx;
- line-height: 34rpx;
- text-decoration: line-through;
- color: #999999;
- }
- }
- .rt-wrap {
- display: flex;
- align-items: center;
- .btn-wrap {
- display: flex;
- align-items: center;
- .btn-img {
- width: 32rpx;
- height: 32rpx;
- }
- .btn-text {
- font-size: 25rpx;
- color: #999;
- }
- }
- }
- }
- .bm-wrap {
- margin-top: 20rpx;
- font-size: 34rpx;
- font-weight: bold;
- line-height: 48rpx;
- color: #333333;
- .shop-icon {
- margin-right: 6rpx;
- width: 32rpx;
- height: 32rpx;
- margin-top: -10rpx;
- border-radius: 10rpx;
- vertical-align: middle; // 解决图片下边框缝隙问题
- }
- }
- .quan-block{
- width: 100%;
- height: 132rpx;
- background: url('https://ld.726p.com/ldyx_static/imgs/quan-bg.png') no-repeat;
- background-size: 100%;
- margin-top: 44rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- .quan-button{
- width: 213rpx;
- color: #FFFFFF;
- font-size: 36rpx;
- line-height: 50rpx;
- text-align: center;
- }
- .quan-info{
- flex:1;
- padding-left: 20rpx;
- .quan-info-1{
- color: #FFFFFF;
- font-size: 24rpx;
- line-height: 34rpx;
- .quan-price{
- color:#FFFFFF;
- font-size:56rpx;
- line-height: 70rpx;
- }
- }
- .quan-time{
- color: #FFFFFF;
- font-size: 22rpx;
- line-height: 32rpx;
- }
- }
- }
- .btm-wrap {
- margin-top: 10rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- .commission-wrap {
- display: flex;
- flex-direction: column;
- justify-content: center;
- width: 346rpx;
- height: 108rpx;
- padding-left: 20rpx;
- color: #9F5C0A;
- background-color: #FEF5E3;
- border-radius: 4rpx;
- .price {
- font-size: 32rpx;
- }
- .tips {
- margin-top: 6rpx;
- font-size: 22rpx;
- }
- }
- .coupon-wrap {
- display: flex;
- flex-direction: column;
- justify-content: center;
- width: 346rpx;
- height: 108rpx;
- padding-left: 20rpx;
- background-image: url("https://ld.726p.com/ldyx_static/imgs/bg-quan-medium.png");
- background-repeat: no-repeat;
- background-size: 100% 100%;
- color: #F23D45;
- .price {
- font-size: 32rpx;
- }
- .tips {
- margin-top: 6rpx;
- font-size: 22rpx;
- }
- }
- }
- }
- .shop-wrap {
- background-color: #fff;
- margin-top: 10rpx;
- display: flex;
- align-items: center;
- .lt-wrap {
- display: flex;
- align-items: center;
- justify-content: center;
- .shop-img {
- border-radius: 10rpx;
- width: 90rpx;
- height: 90rpx;
- }
- }
- .rt-wrap {
- flex: 1;
- margin-left: 20rpx;
- padding-right: 40rpx;
- .tp-wrap {
- display: flex;
- align-items: center;
- justify-content: space-between;
- .shop-name {
- width: 430rpx;
- font-size: 34rpx;
- line-height: 40rpx;
- color: #333;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- -o-text-overflow:ellipsis;
- }
- .enter-wrap {
- display: flex;
- align-items: center;
- font-size: 24rpx;
- color: #333;
- .enter-img {
- width: 10rpx;
- height: 20rpx;
- margin-left: 6rpx;
- }
- }
- }
- .point-wrap {
- margin-top: 20rpx;
- display: flex;
- justify-content: space-between;
- color: #999;
- font-size: 24rpx;
- line-height: 30rpx;
- }
- }
- }
- .recommend-wrap {
- margin-top: 10rpx;
- padding-top: 22rpx;
- background-color: #fff;
- .goods-list-wrap {
- padding: 20rpx 6rpx 10rpx;
- display: flex;
- justify-content: space-between;
- .goods-item-wrap {
- width: 200rpx;
- .goods-img {
- width: 200rpx;
- height: 200rpx;
- border-radius: 10rpx;
- vertical-align: middle;
- }
- .goods-commission {
- padding: 4rpx 0;
- text-align: center;
- background: linear-gradient(45deg, #F57B2A 0%, #F13840 100%);
- color: #fff;
- font-size: 20rpx;
- }
- .goods-title {
- margin-top: 4rpx;
- padding-right: 4rpx;
- font-size: 26rpx;
- line-height: 40rpx;
- color: #333;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- -o-text-overflow:ellipsis;
- }
- .goods-price {
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-top: 4rpx;
- .price {
- font-size: 26rpx;
- color: #F51400;
- }
- .price-old {
- margin-right: 4rpx;
- font-size: 20rpx;
- color: #999;
- text-decoration: line-through;
- }
- }
- }
- }
- }
- .detail-wrap {
- margin-top: 10rpx;
- padding-top: 10rpx;
- background-color: #fff;
- padding-top: 20rpx;
- .content {
- .price-img {
- width: 100%;
- height: 368rpx;
- }
- }
- }
- .guess-wrap {
- padding-top: 10rpx;
- background-color: transparent;
- padding: 0;
- .goods-list-double-wrap {
- display: flex;
- justify-content: space-between;
- flex-wrap: wrap;
- background: #f5f5f5;
- margin:auto;
- margin-top: 22rpx;
- .verticalGoodItem{
- margin-bottom: 22rpx;
- }
- }
- }
- .footer-wrap {
- position: fixed;
- bottom: 0;
- left: 0;
- right: 0;
- background-color: #fff;
- display: flex;
- align-items: center;
- justify-content: center;
- width: 100%;
- height: 150rpx;
- padding: 25rpx;
- border-top: 1rpx solid #eee;
- .btn-wrap {
- background-color: #FFBB93;
- display: flex;
- align-items: center;
- width: 600rpx;
- height: 84rpx;
- border-radius: 84rpx;
- overflow: hidden;
- .btn-item {
- height: 100%;
- flex: 1;
- display: flex;
- justify-content: center;
- align-items: center;
- .btn-icon {
- margin-right: 10rpx;
- }
- .btn-text {
- color: #fff;
- font-size: 36rpx;
- font-weight: bold;
- line-height: 84rpx;
- }
- &.lt-btn {
- .btn-icon {
- width: 42rpx;
- height: 38rpx;
- }
- }
- &.rt-btn {
- background: linear-gradient(90deg, #FF9048 0%, #FB3F3C 100%);
- border-radius: 42rpx;
- .btn-icon {
- width: 42rpx;
- height: 44rpx;
- }
- }
- }
- }
- }
- }
- .btn-collect-wrap{
- display: flex;
- flex-direction: column;
- align-items: center;
- margin-right: 28rpx;
- .btn-collect-img{
- width: 42rpx;
- height: 42rpx;
- }
- .btn-collect-text{
- color: #666666;
- font-size: 20rpx;
- line-height: 28rpx;
- }
- }
- .block-title{
- line-height: 60rpx;
- font-size: 34rpx;
- padding: 0;
- font-weight: bold;
- text-align: center;
- }
- .sales2{
- color: #999;
- font-size: 24rpx;
- margin-left: 4rpx;
- text-decoration: line-through;
- }
- .commission-price-view{
- width: 100%;
- line-height: 72rpx;
- background: linear-gradient(90deg, #FF9048 0%, #FB3F3C 100%);
- border-radius: 20rpx 20rpx 0px 0px;
- color: #FFFFFF;
- font-size: 32rpx;
- padding: 0 44rpx;
- position: relative;
- margin-top: -30rpx;
- }
|