合成照相馆小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
photo_uniapp/pagesA/photo/this.scss

311 lines
4.9 KiB

.photo_main{
//background-color: #E3E8FE;
width: 702rpx;
margin-left: 24rpx;
top: 0;
left: 0;
color: #000;
overflow: hidden;
}
.photo_full_blue_btn{
background: linear-gradient(to right, #4F93FF, #9976FF);
border-radius: 80rpx;
color: #fff;
font-size: 30rpx;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.photo_back {
background-color: #E3E8FE;
min-height: 100vh;
width: 100%;
top: 0;
left: 0;
height: 100%;
overflow: hidden;
}
image{
width: 100%;
height: 100%;
}
.search_div{
width: 100%;
height: 80rpx;
background: #FFFFFF;
border-radius: 40rpx 40rpx 40rpx 40rpx;
display: flex;
justify-content: space-between;
align-items: center;
.search_div_1{
width: 45rpx;
height: 45rpx;
margin-left: 24rpx;
}
.search_div_2{
width: 400rpx;
}
.search_div_3{
width: 158rpx;
height: 64rpx;
color: #fff;
font-size: 26rpx;
font-weight: bold;
background: linear-gradient(to right, #5093FF, #9478FF);
border-radius: 32rpx;
display: flex;
align-items: center;
justify-content: center;
margin-right: 24rpx;
}
}
.tabs_div{
width:350rpx;
margin: 10rpx auto;
}
.photo_list_div{
width: 100%;
margin-top: 20rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
height: calc(100vh - 425rpx);
// overflow-x: hidden;
// overflow-y: scroll;
.photo_list_div_one{
width: 340rpx;
height: 440rpx;
margin-bottom: 20rpx;
// margin-top: 24rpx;
.photo_list_div_one_img{
width: 100%;
height: 100%;
image{
width: 100%;
height: 100%;
border-radius: 24rpx;
}
}
.photo_list_div_one_text{
margin-top: -66rpx;
margin-left: 2%;
width: 96%;
display: flex;
justify-content: center;
color: #fff;
font-size: 28rpx;
font-weight: 400;
height: 40rpx;
overflow: hidden;
}
}
}
// ---------------------------- photo_tem_1
.photo_tem_1{
margin-top: 20rpx;
width:100%;
height: 1120rpx;
background: url('/static/img/photo/photo_12.png') no-repeat;
background-size: 100% 100%;
overflow: hidden;
.photo_tem_1_head{
width: 654rpx;
display: flex;
margin: 36rpx auto;
justify-content: space-between;
align-items: center;
.photo_tem_1_head_1{
width: 80rpx;
height: 80rpx;
border-radius: 8rpx;
image{
border-radius: 8rpx;
}
}
.photo_tem_1_head_2{
width: 400rpx;
.photo_tem_1_head_2_1{
color: #fff;
font-size: 28rpx;
}
.photo_tem_1_head_2_2{
color: #fff;
font-size: 22rpx;
}
}
.photo_tem_1_head_3{
width: 120rpx;
height: 54rpx;
margin-top: 12rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: #fff;
border-radius: 38rpx;
.y_btn{
width: 112rpx;
height: 44rpx;
color: #3B1705;
background-color: #FBE579;
border-radius: 30rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
font-weight: bold;
}
}
}
.photo_tem_1_2{
width: 654rpx;
height: 880rpx;
margin:76rpx auto;
border-radius: 24rpx;
image{
border-radius: 24rpx;
}
}
}
.photo_tem_2{
margin-top: 100rpx;
width: 702rpx;
height: 88rpx;
background: linear-gradient(to right, #4F93FF, #9976FF);
border-radius: 80rpx;
color: #fff;
font-size: 30rpx;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
margin-bottom: 40rpx;
}
// ----------------face
.photo_main_face{
margin-top: -40px;
background-color: #fff;
min-height: 100vh;
width: 100%;
top: 0;
left: 0;
height: 100%;
overflow: hidden;
.photo_main_face_head{
height: 400rpx;
width: 100%;
background: linear-gradient( 180deg, #D1DAFF 0%, rgba(209,218,255,0.6) 46%, rgba(254,254,255,0) 100%);
}
.photo_main_face_1{
width: 554rpx;
height: 82rpx;
margin: 40rpx auto;
margin-top: -180rpx;
}
.photo_main_face_2{
width: 510rpx;
margin: 20rpx auto;
display: flex;
justify-content: space-around;
align-items: center;
.photo_main_face_2_1{
color: #999999;
font-size: 24rpx;
}
.photo_main_face_2_2{
width: 26rpx;
height: 26rpx;
margin-top: -13rpx;
}
}
.photo_main_face_3{
width: 702rpx;
margin: 30rpx auto;
display: flex;
flex-wrap: wrap;
// justify-content: space-around;
.photo_main_face_3_one{
width: 136rpx;
height: 136rpx;
// border-radius: 18rpx;
border: solid 2rpx #EAE7F9;
background-color: #F5F6FB;
.photo_main_face_3_one_icon{
width: 26rpx;
height: 26rpx;
margin-top: -140rpx;
margin-left: 100rpx;
image{
border-radius: 0;
}
}
}
}
.photo_main_face_4{
width:702rpx;
height: 80rpx;
margin: 40rpx auto;
}
.photo_main_face_5{
width: 702rpx;
font-size: 28rpx;
color: #333333;
margin: 0rpx auto;
font-weight: 400;
}
.photo_main_face_6{
width: 702rpx;
height: 514rpx;
margin: 80rpx auto;
}
}