Files
sphc/pages/goodsDetails/goodsDetails.wxss
2024-05-06 15:34:15 +08:00

517 lines
7.8 KiB
Plaintext

.u-wrp-bnr {
width: 100%;
height: 750rpx;
display: block;
position: relative;
background: #f0f0f0;
z-index: 5
}
.u-img-slide {
width: 100%;
height: 750rpx;
}
.content{
position: relative
}
.num {
position: absolute;
top: 676rpx;
right: 30rpx;
color: #fff;
height: 40rpx;
background: #00000080;
border-radius: 20rpx;
line-height: 40rpx;
padding: 0 15rpx;
font-size: 22rpx;
z-index: 100;
}
.num image{
width: 22rpx;
height: 21rpx;
margin-right: 10rpx;
}
.flash-box{
position: absolute;
bottom: 0;
height: 100rpx;
width: 100%;
line-height: 100rpx;
}
.miao-back{
position: absolute;
top: 0;
width: 100%;
height: 100rpx;
z-index: 30;
}
.flash-common{
font-size: 32rpx;
color: #fefefe;
margin-left: 30rpx;
}
.flash-old{
font-size: 24rpx;
color: #fefefe;
margin-left: 30rpx;
text-decoration: line-through;
}
.flash-text{
font-size: 24rpx;
color: #fefefe;
margin-left: 36rpx;
}
.flash-right{
margin-right: 19rpx;
z-index: 50;
width: 174rpx;
}
.flash-top{
margin-top: 16rpx;
height: 28rpx;
}
.flash-top image{
width: 26rpx;
height: 28rpx;
}
.flash-top view{
font-size: 22rpx;
color: #212320;
}
.flash-time{
margin-top: 10rpx;
color: #fff;
font-size: 22rpx;
height: 36rpx;
margin-left: 10rpx
}
.flash-time view{
width: 36rpx;
height: 36rpx;
line-height: 36rpx;
text-align: center;
background-color: #212320;
border-radius: 2rpx;
}
.flash-time text{
margin: auto 5rpx;
line-height: 36rpx;
}
.num-title-flash{
color: #666;
font-size: 22rpx;
}
/* 商品 */
.detail-block {
padding: 27rpx 30rpx;
background-color: #ffffff;
}
.detail-title {
font-size: 30rpx;
color: #333333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.detail-title .exchange-num-one {
font-size: 28rpx !important;
color: #ee7b1e !important;
}
.exchange-num-juan {
font-size: 34rpx;
color: #999999;
}
.exchange-num-two {
font-size: 28rpx;
color: #999999;
text-decoration: line-through;
margin-left: 20rpx;
}
.exchange-num-three{
font-size: 30rpx;
color: #ff291e;
margin-left:40rpx;
}
.detail-text {
font-size: 40rpx;
color: #ee7b1e;
}
.detail-price {
font-size: 32rpx;
color: #333333;
margin-top: 29rpx;
}
.detail-bottom {
margin-top: 39rpx;
font-size: 24rpx;
color: #111111;
}
.detail-bottom-l__1,.detail-bottom-l__2{
height: 38rpx;
line-height: 38rpx;
background-color: #fdf2e8;
border-radius: 4rpx;
font-size: 24rpx;
color: #ee7b1e;
padding: 0 10rpx;
margin-right: 20rpx;
}
.detail-bottom-l__2{
position: relative;
}
.detail-bottom-l__2 button{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
}
.detail-bottom-r{
font-size: 24rpx;
color: #999999;
}
.detail-choose {
display: flex;
align-items: center;
justify-content: space-between;
height: 100rpx;
line-height: 100rpx;
background-color: #ffffff;
border-radius: 20rpx;
margin-top: 14rpx;
padding: 0 30rpx;
}
.detail-choose text:first-child {
font-size: 28rpx;
font-weight: bold;
color: #333333;
}
.detail-choose text:nth-child(2) {
flex: 0.9;
font-size: 28rpx;
color: #999999;
margin-left: 47rpx;
}
/* 商品详情 */
.detImg-header {
width: 100%;
height: 100rpx;
}
.detImg-header image {
width: 100%;
height: 100rpx;
}
.detail-img {
/* padding-bottom: 28rpx; */
background-color: #ffffff;
/* margin-bottom: 120rpx; */
}
.detail-img image {
width: 100% !important;
display: block;
}
/* 加入购物车 */
.cartshop-block {
position: fixed;
bottom: 0;
width: 690rpx;
padding:0 30rpx;
display: flex;
align-items: center;
height: 100rpx;
background-color: #ffffff;
}
.cartshop-img {
width: 40rpx;
height: 40rpx;
}
.cartshop-img-box {
height: 64rpx;
margin: 18rpx 0;
position: relative;
}
.cartshop-img-box button{
width: 40rpx !important;
opacity: 0;
height: 100%;
margin: 0;
padding: 0;
position: absolute;
left:0;
top: 0;
z-index: 10;
}
.cartshop-img-name{
font-size: 20rpx;
color: #333333;
line-height: 24rpx;
}
.cartshop-img-num {
position: absolute;
top: -8rpx;
right: -12rpx;
height: 30rpx;
line-height: 30rpx;
background-color: #ff0000;
border-radius: 18rpx;
color: #fff;
font-size: 20rpx;
text-align: center;
display: inline-block;
padding: 0 10rpx;
}
.cart-add text {
display: inline-block;
width: 180rpx;
height: 65rpx;
line-height: 65rpx;
font-size: 28rpx;
text-align: center;
}
.cart-add text:first-child {
background-color: #ee7b1e;
color: #fff;
border-radius: 40rpx 0rpx 0rpx 40rpx;
}
.cart-add text:last-child {
background-color: #ff291e;
border-radius: 0rpx 40rpx 40rpx 0rpx;
color: #fff;
}
.cart-share {
width: 180rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
background-color: #ffb400;
border-radius: 40rpx;
font-size: 28rpx;
color: #ffffff;
margin-right: 12rpx;
}
/* 弹窗 */
.show {
display: block
}
.hide {
display: none
}
.commodity_screen {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0,0,0,0.6);
opacity: 1;
z-index: 1000;
color: #fff;
}
.commodity_attr_box {
width: 100%;
background-color: #ffffff;
border-radius: 20rpx 20rpx 0rpx 0rpx;
position: fixed;
bottom: 0;
left: 0;
z-index: 2000;
}
.hideModal {
font-size: 49rpx;
color: rgba(183, 183, 183, 0.95);
position: absolute;
top: 26rpx;
right: 30rpx;
}
.choose-img {
margin-top: 40rpx;
padding: 0 30rpx 25rpx;
width: 690rpx;
border-bottom:solid 2rpx #c9c9c9;
}
.choose-img image {
width: 200rpx;
height: 200rpx;
}
.choose-right {
margin-left: 50rpx
}
.choose-right view {
margin-top: 20rpx
}
.choose-right view:nth-child(2) {
font-size: 24rpx;
color: #999999;
}
.choose-right view:last-child {
font-size: 24rpx;
color: #666666;
}
.choose-img text {
font-size: 36rpx;
color: #da0000;
margin-left: 20rpx;
margin-top: 120rpx
}
.standard-height {
height: 180rpx;
}
.standard-title {
font-size: 30rpx;
color: #333333;
padding: 44rpx 30rpx 0 30rpx;
}
.standard-box {
padding: 0 28rpx;
}
.standard-text:first-child {
margin-left: 0;
}
.standard-text {
font-size: 24rpx;
color: #333333;
padding: 14rpx 24rpx;
background-color: #e5e5e5;
border-radius: 10rpx;
margin-left: 50rpx;
border: solid 1rpx #e5e5e5;
margin-top: 38rpx;
}
.active {
color: #fff;
background-color: #ee7b1e;
}
.standard-num-box {
display: flex;
justify-content: space-between;
padding: 0 32rpx;
margin-top: 10rpx;
}
.num-title {
font-size: 30rpx;
color: #333333;
}
.standard-num {
display: flex;
border-radius: 5rpx;
height: 50rpx;
line-height: 50rpx;
font-size: 26rpx;
}
.standard-num text {
width: 42rpx;
height: 42rpx;
line-height: 42rpx;
display: lnline-block;
text-align: center;
border-radius: 50%;
}
.standard-num .reduce {
border: solid 1rpx #ee7b1e;
color: #ee7b1e;
}
.standard-num .add {
background-color: #ee7b1e;
color: #fff;
}
.standard-num input {
text-align: center;
margin: 0 10rpx;
width: 70rpx;
}
.cart {
margin:30rpx auto;
width: 690rpx;
height: 80rpx;
line-height: 80rpx;
background-image: linear-gradient(-90deg,
#ee7b1e 0%,
#fdae03 100%);
border-radius: 40rpx;
text-align: center;
font-size: 32rpx;
color: #ffffff;
}
.cart text {
width: 100%;
display: block;
}
.cart .cart_4{
background-color: #999999;
border-radius: 40rpx;
}
.wIntegral{
width: 750rpx;
height: 90rpx;
background-color: #fff;
position: fixed;
bottom: 0;
}
.wIntegral view{
background-color: #ee7b1e;
color: #fff;
font-size: 28rpx;
text-align: center;
line-height: 64rpx;
height: 64rpx;
width: 690rpx;
border-radius: 32rpx;
}
.wLogin{
width: 750rpx;
height: 90rpx;
text-align: center;
line-height: 90rpx;
background-color: #ee7b1e;
color: #fff;
font-size: 28rpx;
position: fixed;
bottom: 0;
}