袁磊 8 months ago
parent
commit
7971cdb3b3
  1. 6
      static/style/nine-base-001.scss
  2. 140
      static/style/nine-base-002.scss
  3. 15
      static/style/nine-base-003.scss
  4. 30
      static/style/nine-btn-001.scss
  5. 46
      static/style/nine-image-001.scss
  6. 14
      static/style/nine-list-001.scss
  7. 54
      static/style/nine-nav-001.scss

6
static/style/nine-base-001.scss

@ -34,11 +34,14 @@
.color-black{ color: black }
.color-f1f1f1{ color: #f1f1f1 }
.bgcolor-gray{ background-color: gray }
.bgcolor-green{ background-color: green }
.bgcolor-blue{ background-color: blue }
.bgcolor-red{ background-color: red }
.bgcolor-pink{ background-color: pink }
.bgcolor-white{ background-color: white }
.bgcolor-lightblue{ background-color: lightblue }
.bgcolor-dff5fa{ background-color: #dff5fa }
.bgcolor-cce1e6{ background-color: #cce1e6 }
.bgcolor-787fff{ background-color: #787fff }
.bgcolor-eef0ff{ background-color: #eef0ff }
@ -59,6 +62,7 @@
.border-f1f1f1{ border: 3rpx solid #f1f1f1 }
.border-radius10{ border-radius: 10rpx }
.border-radius50{ border-radius: 50% }
.position-fixed{ position: fixed }
.position-absolute{ position: absolute }
@ -144,6 +148,7 @@
.pa300{ padding: 300rpx }
.ptb0{ padding-top: 0rpx; padding-bottom: 0rpx }
.ptb2{ padding-top: 2rpx; padding-bottom: 2rpx }
.ptb5{ padding-top: 5rpx; padding-bottom: 5rpx }
.ptb10{ padding-top: 10rpx; padding-bottom: 10rpx }
.ptb15{ padding-top: 15rpx; padding-bottom: 15rpx }
@ -459,6 +464,7 @@
.mb-300{ margin-bottom: -300rpx }
.ml0{ margin-left: 0rpx }
.ml2{ margin-left: 2rpx }
.ml5{ margin-left: 5rpx }
.ml10{ margin-left: 10rpx }
.ml15{ margin-left: 15rpx }

140
static/style/nine-base-002.scss

@ -1,38 +1,44 @@
.height100{
height: 100%;
height: 100%;
}
.width23{
width: 23%;
}
.width24{
width: 24%;
}
.width25{
width: 25%;
width: 25%;
}
.width30{
width: 30%;
width: 30%;
}
.width45{
width: 45%;
width: 45%;
}
.width46{
width: 46%;
width: 46%;
}
.width47{
width: 47%;
width: 47%;
}
.width48{
width: 48%;
width: 48%;
}
.width49{
width: 49%;
width: 49%;
}
.width50{
width: 50%;
width: 50%;
}
.width80{
width: 80%;
width: 80%;
}
.width90{
width: 90%;
width: 90%;
}
.width100{
width: 100%;
width: 100%;
}
.test{ border: 3rpx solid red}
@ -50,64 +56,76 @@
.float-left{ float: left; }
.float-right{ float: right; }
// 允许文本复制
.nine-user-select {
cursor: auto;
-webkit-user-select: text;
user-select: text;
}
.display-flex-row{
display: flex;
flex-direction: row;
align-items: center;
display: flex;
flex-direction: row;
align-items: center;
}
.display-flex-column{
display: flex;
flex-direction: column;
display: flex;
flex-direction: column;
}
.display-flex-column-center{
display: flex;
flex-direction: column;
justify-content: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.display-flex-row-between{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.display-flex-row-center{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.display-flex-row-around{
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
}
.display-flex-row-end{
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
.display-flex-row-wrap{
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-content: flex-start;
}
.display-flex-column-between{
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.display-flex-column-around{
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.justify-content-center{
justify-content: center
justify-content: center
}
.flex1{
flex: 1
flex: 1
}
.overflow-x-auto{
overflow-x: auto;
}
.overflow-y-auto{
overflow-y: auto;
}
.text-nowrap{
white-space:nowrap;
@ -118,19 +136,33 @@
white-space: nowrap;
}
// 不占位隐藏
.display-none{ display: none }
// 占位隐藏
.visibility-hidden{ visibility: hidden }
// 放大缩小比例
.transform-scale05{
transform: scale(0.5);
transform: scale(0.5);
}
.transform-scale06{
transform: scale(0.6);
transform: scale(0.6);
}
.transform-scale07{
transform: scale(0.7);
transform: scale(0.7);
}
.transform-scale08{
transform: scale(0.8);
transform: scale(0.8);
}
.transform-scale09{
transform: scale(0.9);
transform: scale(0.9);
}
// 旋转90度
.transform-rotate90{
transform: rotate(90deg);
ms-transform: rotate(90deg); /* IE 9 */
moz-transform: rotate(90deg); /* Firefox */
webkit-transform: rotate(90deg); /* Safari and Chrome */
o-transform: rotate(90deg); /* Opera */
}

15
static/style/nine-base-003.scss

@ -0,0 +1,15 @@
.nine-nomore-001{
padding: 25rpx;
text-align: center;
}
.nine-nomore-001-span{
font-size: 12px;
color: lightgray
}
// 允许文本复制
.nine-user-select {
cursor: auto;
-webkit-user-select: text;
user-select: text;
}

30
static/style/nine-btn-001.scss

@ -1,27 +1,27 @@
// 边框蓝字体蓝用于获取短信验证码按钮
.nine-btn-verify-001{
border-radius: 10rpx;
color: #1e1eff;
border: 3rpx solid #1e1eff;
border-radius: 10rpx;
color: #1e1eff;
border: 3rpx solid #1e1eff;
}
// 保存按钮
.nine-btn-save-001{
padding: 20rpx;
border-radius: 10rpx;
color: #fff;
background-color: #0000ff;
text-align: center;
padding: 20rpx;
border-radius: 10rpx;
color: #fff;
background-color: #0000ff;
text-align: center;
}
// 退出登录
.nine-btn-login-out-001{
padding: 20rpx;
border-radius: 10rpx;
color: red;
background: #fff;
text-align: center;
padding: 20rpx;
border-radius: 10rpx;
color: red;
background: #fff;
text-align: center;
}
// 灰色横线
.nine-line-001{
height: 1rpx;
border-top: 1rpx solid #d9d9d9;
height: 1rpx;
border-top: 1rpx solid #d9d9d9;
}

46
static/style/nine-image-001.scss

@ -1,36 +1,46 @@
.image35{
width: 35rpx;
height: 35rpx;
width: 35rpx;
height: 35rpx;
}
.image40{
width: 40rpx;
height: 40rpx;
width: 40rpx;
height: 40rpx;
}
.image50{
width: 40rpx;
height: 40rpx;
width: 50rpx;
height: 50rpx;
}
.image60{
width: 60rpx;
height: 60rpx;
}
.image70{
width: 70rpx;
height: 70rpx;
width: 70rpx;
height: 70rpx;
}
.image80{
width: 70rpx;
height: 70rpx;
width: 70rpx;
height: 70rpx;
}
.image90{
width: 90rpx;
height: 90rpx;
width: 90rpx;
height: 90rpx;
}
.image150{
width: 150rpx;
height: 150rpx;
width: 150rpx;
height: 150rpx;
}
.image200{
width: 200rpx;
height: 200rpx;
width: 200rpx;
height: 200rpx;
}
.image400{
width: 400rpx;
height: 400rpx;
width: 400rpx;
height: 400rpx;
}
// 验证码大小
.image-size-verify-001{
width: 150rpx;
height: 35px;
}

14
static/style/nine-list-001.scss

@ -1,9 +1,13 @@
.nine-list-001{
padding: 10rpx;
padding: 10rpx;
}
.nine-list-001-item{
background-color: #fff;
margin: 10rpx 0;
padding: 10rpx 30rpx;
border-radius: 10rpx;
background-color: #fff;
margin: 10rpx 0;
padding: 10rpx 30rpx;
border-radius: 10rpx;
}
.nine-list-001-item-image-image{
width: 40rpx;
height: 30rpx;
}

54
static/style/nine-nav-001.scss

@ -1,39 +1,39 @@
.nine-nav-001{
display: flex;
flex-direction: column;
padding: 10rpx;
flex: 1;
height: 100%;
overflow-y: auto;
display: flex;
flex-direction: column;
padding: 10rpx;
flex: 1;
height: 100%;
overflow-y: auto;
}
.nine-nav-001-item{
background: #fff;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 5rpx;
padding: 20rpx 15rpx;
border-radius: 1rpx;
border-style: solid;
border-width: 0px;
background: #fff;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 5rpx;
padding: 20rpx 15rpx;
border-radius: 1rpx;
border-style: solid;
border-width: 0px;
}
.nine-nav-001-item-left{
display: flex;
flex-direction: row;
align-items: center;
padding: 2rpx 10rpx;
display: flex;
flex-direction: row;
align-items: center;
padding: 2rpx 10rpx;
}
.nine-nav-001-item-left-text{
font-size: 16px;
padding-left: 20rpx;
font-size: 16px;
padding-left: 20rpx;
}
.nine-nav-001-item-right{
display: flex;
flex-direction: row;
align-items: center;
display: flex;
flex-direction: row;
align-items: center;
}
.nine-nav-001-item-right-image{
width: 16rpx;
height: 35rpx;
width: 16rpx;
height: 35rpx;
}
Loading…
Cancel
Save