press-pix
Version:
基于 PixUI 的 Press 组件库
141 lines (127 loc) • 2.56 kB
text/less
@import '../../common/styles/pubgm/mixins.less';
.pmg-switch-language{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
z-index: 99;
background: rgba(36, 36, 36, .7);
}
.pmg-language-head{
display: flex;
align-items: center;
justify-content: flex-end;
padding-right: .88rem;
padding-top: .32rem;
}
.pmg-language-title{
margin-right: .24rem;
margin-left: .24rem;
font-size: .4rem;
font-weight: bold;
color: #fff;
}
.pmg-btn-close{
width: .33rem;
height: .33rem;
.bgUrl('comp/icon-close.png');
z-index: 2;
}
.pmg-language-content {
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%;
height: 4.12rem;
background-color: #282828;
padding-left: .56rem;
padding-right: .66rem;
padding-bottom: .32rem;
}
.pmg-language-content-texture{
position: absolute;
bottom: 0;
right: 0;
width: 6.84rem;
height: 2.8rem;
.bgUrl('comp/img-grid.png');
}
.pmg-language-left{
display: flex;
flex-direction: column;
flex-grow: 1;
z-index: 99;
position: relative;
&.pmg-active{
padding-top: .64rem;
}
}
.pmg-language-select{
display: flex;
align-items: center;
height: .64rem;
line-height: .64rem;
padding-left: .56rem;
font-size: .22rem;
color: rgba(255, 255, 255, .7);
.pmg-language-select-text{
line-clamp: 1;
}
}
.pmg-language-list{
display: flex;
flex-wrap: wrap;
justify-content: center;
align-content: flex-start;
overflow: scroll;
height: 100%;
background: #1c1c1c;
padding: .32rem .44rem 0;
}
.pmg-language-item{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 2.56rem;
padding: 0 .12rem;
height: .64rem;
margin: 0 .12rem .24rem;
font-size: .22rem;
color: #fff;
border: .02rem solid rgba(255, 255, 255, .5);
background-color: rgba(53, 53, 53, .6);
flex-grow: 1;
.pmg-language-item-text{
line-clamp: 1;
}
&.pmg-language-item-selected{
color: #C7FFF6;
border: .02rem solid #C7FFF6;
background-color: rgba(51, 78, 82, .6);
}
&.pmg-language-item-disable{
color: rgba(255, 255, 255, .3);
border: .02rem solid rgba(255, 255, 255, .5);
}
}
.pmg-language-placeholder-item{
flex-shrink: 0;
width: 2.56rem;
height: 0;
margin: 0 .12rem;
flex-grow: 1;
}
.pmg-btn-confirm{
flex-shrink: 0;
align-self: flex-end;
margin-left: .66rem;
z-index: 99;
position: relative;
}