| | |
| | | font-size: 1.6rem; |
| | | } |
| | | html,body{ |
| | | // width: 8.28rem; |
| | | max-width: 828px; |
| | | margin: 0 auto; |
| | | height: 100%; |
| | |
| | | body { |
| | | width: 100%; |
| | | height: 100%; |
| | | // overflow: hidden; |
| | | font-size:30px; |
| | | font-family: "微软雅黑"; |
| | | font-weight: 400; |
| | | padding-bottom: constant(safe-area-inset-bottom); |
| | | padding-bottom: env(safe-area-inset-bottom); |
| | | /*兼容 IOS>11.2*/ |
| | | // font-size: .32rem; |
| | | // background: #9E9FA3; |
| | | } |
| | | @supports (bottom: constant(safe-area-inset-bottom)) { |
| | | body { |
| | |
| | | touch-action: none; |
| | | } |
| | | |
| | | /* 颜色值 */ |
| | | $white:#ffffff; |
| | | $black:#000000; |
| | | $dark-black:#22262F; |
| | | $grey:#868C9A; |
| | | // $grey: #f3f3f3; |
| | | $dark-grey: #868C9A; |
| | | $light-grey:#C8CAD2; |
| | | $border-grey:#E5E7ED; |
| | |
| | | $green:#2EBD85; |
| | | $purple:#9A4DFD; |
| | | $night:#121212; |
| | | // overwrite vant |
| | | |
| | | .mining-pledge { |
| | | .van-tabs__wrap { |
| | |
| | | --theme-color: #2C78F8; |
| | | } |
| | | |
| | | /***************** global use framework *****************/ |
| | | |
| | | /* flex */ |
| | | .flex { display: flex; } |
| | | .flex-row { flex-direction: row;} |
| | | .flex-col { flex-direction: column; } |
| | |
| | | .flex-nowrap { flex-wrap: nowrap;} |
| | | .align-center{align-content:center;} |
| | | |
| | | /* display */ |
| | | .block { display: block;} |
| | | |
| | | /* position */ |
| | | .absolute { position: absolute; } |
| | | .relative { position: relative; } |
| | | .fixed { position: fixed; } |
| | | .z-10 { z-index: 10;} |
| | | |
| | | /* font */ |
| | | .font-bold { font-weight: bold; } |
| | | .font-normal { font-weight: normal; } |
| | | |
| | | /* text */ |
| | | .text-center { text-align: center;} |
| | | .text-left { text-align: left;} |
| | | .text-right { text-align: right;} |
| | | .break-word{word-break: break-word} |
| | | /* padding margin font */ |
| | | @for $i from 0 through 50 { |
| | | |
| | | // font-weight |
| | | // font-size |
| | | // margin |
| | | .ml-#{$i} { |
| | | margin-left: #{$i}px |
| | | } |
| | |
| | | margin-top: #{$i}px; |
| | | margin-bottom: #{$i}px; |
| | | } |
| | | // padding |
| | | .pl-#{$i} { |
| | | padding-left: #{$i}px |
| | | } |
| | |
| | | padding-top: #{$i}px; |
| | | padding-bottom: #{$i}px; |
| | | } |
| | | // width |
| | | .w-#{$i} { |
| | | width: #{$i}px |
| | | } |
| | | // height |
| | | } |
| | | |
| | | @for $j from 1 through 100 { |
| | | |
| | | // height |
| | | .h-#{$j} { |
| | | height: #{$j}px |
| | | } |
| | | //line-height |
| | | .lh-#{$j} { |
| | | line-height: #{$j}px |
| | | } |
| | |
| | | .h-screen { height: 100%;} |
| | | .h-1000 { height: 1000px;} |
| | | |
| | | /* background */ |
| | | .bg-white { background: $white; } |
| | | .bg-black { background: #121212;} |
| | | .bg-night{ |
| | |
| | | .bg-grey-f3 { background: $grey;} |
| | | |
| | | |
| | | /* color */ |
| | | .text-white { color: $white; } |
| | | .text-black { color: $black; } |
| | | .text-dark-black{ color:$dark-black;} |