城阳居民端公众号前端代码
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.
 
 
 
 

309 lines
3.8 KiB

@import "../fonts/index.css";
html,
body #app {
color: @black;
background-color: @background-color;
}
#app {
font-size: 16px;
background-size: 100% auto;
font-family:pingfang-ordinary;
}
.card{
background-color: #fff;
border-radius: 8px;
// box-shadow: 0 1px 3px rgba(0,0,0,.3);
padding: 13px;
box-sizing: border-box;
width: auto;
.title{
display: flex;
justify-content: space-between;
align-items: center;
:nth-child(1){
font-family:pingfang-bold;
font-size: 17px;
}
:nth-child(2){
color: #B4B4B4;
font-size: 14px;
}
}
}
.no-data{
height: 50px;
width: 100%;
color: #666666;
text-align: center;
line-height: 50px;
font-size: 15px;
}
.oh{
overflow: hidden;
}
.y66666{
color: #666666;
}
.C1{
color: #C1C1C1;
}
.AAA{
color: #AAAAAA;
}
.white{
color: #fff;
}
.gray{
color: #999999 !important;
}
.orange{
color: #f98f1a;
}
.blue{
color: #3974f6;
}
.flex{
display: flex;
.flex1{
flex: 1;
}
&-1{
flex: 1;
}
&-y{
flex-direction: column;
}
&-x{
flex-direction: row;
}
&-center1{
justify-content: center;
}
&-center2{
align-items: center;
}
&-center3{
align-items: flex-start;
}
//
&-mean{
justify-content: space-around;
}
//两端对齐
&-end{
justify-content: space-between;
}
//水平轴右对齐
&-fend{
justify-content: flex-end;
}
// 允许子元素换行
&-wrap{
flex-wrap: wrap;
}
}
.z{
z-index: 5;
}
.m{
&-left12{
margin-left: 12px;
}
&-left5{
margin-left: 12px;
}
&-left012{
margin-left: -5px;
}
&-left18{
margin-left: 18px;
}
&-right12{
margin-right: 12px;
}
&-right7{
margin-right: 7px;
}
&-top12{
margin-top: 12px;
}
&-top5{
margin-top: 5px;
}
&-bottom5{
margin-bottom: 5px;
}
&-bottom10{
margin-bottom: 10px;
}
&-right10{
margin-right: 10px;
}
&-right26{
margin-right: 26px;
}
&-top15{
margin-top: 15px;
}
&-top10{
margin-top: 10px;
}
&-top18{
margin-top: 18px;
}
&-bot50{
margin-bottom: 50px;
}
&-bot10{
margin-bottom:10px;
}
&-top16{
margin-top:16px;
}
}
.p{
&-18{
padding: 0 18px;
}
&-12{
padding: 12px;
}
}
//固定在底部左侧。背景颜色为白色,全部窗口
.bto_btn{
position: fixed;
bottom: 5px;
left: 0;
background: #ffffff;
width: 100%;
padding: 6px 26px;
box-sizing: border-box;
text-align: right;
}
// 相对定位
.required{
position: relative;
}
.required::after{
content: '*';
position: absolute;
left: -10px;
top: 0;
color: red;
}
.absolute{
position: absolute;
}
.mr10 {
margin-right: 10px;
}
.text{
&-align{
&-center{
text-align: center;
}
&-right{
text-align: right;
}
&-left{
text-align: left;
}
}
}
.primary-color {
color: @blue;
}
.jcsb {
justify-content: space-between;
}
.aic {
align-items: center;
}
.container {
padding: 10px;
}
.img{
&_17{
width: 17px;
height: 17px;
}
&_16{
width: 16px;
height: 16px;
}
&_20{
width: 20px;
height: 20px;
}
&_23{
width: 23px;
height: 23px;
}
&_round{
border-radius: 5px;
}
&_33{
width: 33px;
height: 33px;
}
&_57{
width: 57px;
height: 57px;
}
}
.font-size13{
font-size: 13px;
}
.font-size14{
font-size: 14px;
}
.font-size15{
font-size: 15px;
}
.font-size18{
font-size: 18px;
}
.font-size21{
font-size: 21px;
}
.font-size25{
font-size: 25px;
}
.font-bold{
font-weight: bold;
}
.text{
&-right{
text-align: right;
}
&-left{
text-align: left;
}
}
.bot_btn{
position: fixed;
bottom: 0;
left: 0;
background: #ffffff;
width: 100%;
right: 0;
}
.content{
width: calc(100% - 20px);
margin: 0 auto;
}
.back_color{
background: #F7F7F7;
}
.nowrap{
white-space: nowrap
}