yuminge-app/yun-min-program-plugin-master/packageD/mycomponent/invoice-pop/invoice-pop.wxss

287 lines
6.2 KiB
Plaintext

/* packageD/mycomponent/invoice-pop/invoice-pop.wxss */
@import "/mycss/iconfont.wxss";
view,text{
box-sizing: border-box;
}
.invoice {
background: #fff;
margin-top: 20rpx;
height: 90rpx;
line-height: 90rpx;
font-size: 30rpx;
display: flex;
padding: 0 28rpx;
border-top: solid 2rpx #ebebeb;
border-bottom: solid 2rpx #ebebeb;
position: relative;
justify-content: space-between;
align-items: center;
}
.invoice .left {
display: flex;
align-items: center;
}
.invoice .right {
display: flex;
align-items: center;
justify-content: center;
}
.invoice-pop {
height: 1120rpx;
background: #fff;
}
.invoice-pop .invoice-title {
position: relative;
display: flex;
align-items: center;
justify-content: center;
height: 112rpx;
font-size: 36rpx;
color: #202020;
}
.invoice-pop .invoice-title .title-right {
position: absolute;
display: flex;
align-items: center;
right: 0;
}
.invoice-pop .invoice-title .title-right .icon-fontclass-gantanhao {
font-size: 26rpx;
color: #f15353;
}
.invoice-pop .invoice-title .title-right .text {
margin-left: 9rpx;
font-size: 24rpx;
color: #575757;
}
.invoice-pop .invoice-title .title-right .icon-guanbi {
margin-left: 43rpx;
margin-right: 40rpx;
font-size: 28rpx;
color: #6c6c6c;
}
.invoice-pop .invoice-container {
height: 896rpx;
padding: 0 30rpx;
padding-bottom: 32rpx;
text-align: left;
overflow-y: auto;
}
.invoice-pop .invoice-container .blod-title {
font-size: 26rpx;
color: #373737;
font-weight: bolder;
}
.invoice-pop .invoice-container .split-line {
height: 1rpx;
background-color: #f2f2f2;
}
.invoice-pop .invoice-container .invoice-tabs .tabs-items {
display: flex;
margin-top: 32rpx;
}
.invoice-pop .invoice-container .invoice-tabs .tabs-items .tabs-item {
display: flex;
align-items: center;
justify-content: center;
width: 140rpx;
height: 50rpx;
margin-right: 73rpx;
color: #333333;
font-size: 24rpx;
}
.invoice-pop .invoice-container .invoice-tabs .tabs-items .tabs-item.active {
color: #f15353;
border-radius: 25rpx;
border: solid 1rpx #f15353;
}
.invoice-pop .invoice-container .invoice-desc-text {
margin-top: 26rpx;
font-size: 22rpx;
color: #7c7c7c;
}
.invoice-pop .invoice-container .field-cell {
position: relative;
display: flex;
align-items: center;
}
.invoice-pop .invoice-container .field-cell .icon-fontclass-xinghao {
font-size: 24rpx;
color: #f15353;
}
.invoice-pop .invoice-container .field-cell .field-cell-title {
margin-left: 5rpx;
font-size: 24rpx;
color: #202020;
}
.invoice-pop .invoice-container .field-cell input {
flex: 1;
height: 68rpx;
max-width: 500rpx;
margin-left: 16rpx;
font-size: 24rpx;
color: #7c7c7c;
border: none;
}
.invoice-pop .invoice-container .field-cell .icon-adsystem_icon_cancle{
position: absolute;
right: 0;
z-index: 99;
font-size: 20px;
width: 60rpx;
text-align: right;
padding-right: 15rpx;
}
.invoice-pop .invoice-container .field-cell .fa-angle-right-box {
width: 80rpx;
text-align:right;
padding-right: 15rpx;
}
.invoice-pop .invoice-container .field-cell .invoice-header-list{
position: absolute;
z-index: 2;
transform: translateY(2.5rem);
top: 0;
left: 4.6rem;
width: 11rem;
max-height: 0;
background-color: #ffffff;
box-shadow: 0rem 0.063rem 0.5rem 0rem
rgba(178, 178, 178, 0.47);
border-radius: 0.125rem;
overflow: hidden;
transition: 0.5s;
}
.invoice-pop .invoice-container .field-cell .invoice-header-list.show{
padding-top: 0.3rem;
padding-bottom: 0.381rem;
max-height: 100px;
}
.invoice-pop .invoice-container .field-cell .invoice-header-list .invoice-header-list-item{
padding:0.45rem 0.781rem;
background: #fff;
transition: 0.5s;
}
.invoice-pop .invoice-container .field-cell .invoice-header-list .invoice-header-list-item:active{
filter: brightness(90%);
}
.invoice-pop .invoice-container .address {
display: flex;
align-items: center;
padding-top: 31rpx;
}
.invoice-pop .invoice-container .address .address-container {
flex: 1;
}
.invoice-pop .invoice-container .address .address-container .address-placeholder {
font-size: 24rpx;
color: #7c7c7c;
}
.invoice-pop .invoice-container .address .address-container .address-name {
font-size: 24rpx;
color: #202020;
}
.invoice-pop .invoice-container .address .address-container .address-text {
margin-top: 29rpx;
font-size: 24rpx;
color: #202020;
}
.invoice-pop .invoice-container .address .icon-advertise-next {
color: #202020;
}
.invoice-pop .invoice-btn-wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 112rpx;
padding: 0 74rpx;
}
.invoice-pop .invoice-btn-wrapper .invoice-btn-item {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 70rpx;
font-size: 26rpx;
font-weight: bold;
color: #ffffff;
background-color: #f05152;
border-radius: 35rpx;
}
.explain {
height: 864rpx;
}
.explain .explain-title {
display: flex;
align-items: center;
justify-content: center;
height: 112rpx;
font-size: 18px;
color: #2a2a2a;
font-weight: bold;
}
.explain .explain-container {
width: 100%;
display: flex;
height: 640rpx;
padding: 0 30rpx;
font-size: 30rpx;
text-align: left;
color: #333333;
background: #fff;
overflow-y: auto;
}
.explain .explain-container ._root{
width: 750rpx;
}
.explain .explain-btn-wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 112rpx;
padding: 0 74rpx;
}
.explain .explain-btn-wrapper .explain-btn-item {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 70rpx;
font-size: 26rpx;
font-weight: bold;
color: #ffffff;
background-color: #f05152;
border-radius: 35rpx;
}
.invoice-header-list-container {
height: 22rem;
text-align: left;
padding: 0 1.5rem;
overflow: auto;
}
.invoice-header-list-container .item {
width: 100%;
word-break: break-all;
color: #202020;
padding: 0.3rem 0;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.invoice-header-list-container .item:active {
background: rgba(0, 0, 0, 0.1);
}