lnshnew
This commit is contained in:
513
src/style/common.styl
Normal file
513
src/style/common.styl
Normal file
@@ -0,0 +1,513 @@
|
||||
@import 'mixin.styl'
|
||||
@import 'iconfont.styl'
|
||||
|
||||
body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a, p, h1, h2, h3, h4,h5, h6,textarea, button, input, select, figure, figcaption
|
||||
padding: 0
|
||||
margin: 0
|
||||
list-style: none
|
||||
font-style: normal
|
||||
text-decoration: none
|
||||
border: none
|
||||
outline: none
|
||||
color: $fc1
|
||||
font-size .28rem
|
||||
font-weight: normal
|
||||
font-family: Arial, "Microsoft Yahei", "Helvetica Neue", Helvetica, sans-serif
|
||||
box-sizing: border-box
|
||||
-webkit-tap-highlight-color:transparent
|
||||
-webkit-font-smoothing: antialiased
|
||||
&:hover
|
||||
outline: none
|
||||
|
||||
input[type="button"], input[type="submit"], input[type="search"], input[type="reset"], textarea, select
|
||||
-webkit-appearance: none
|
||||
appearance: none
|
||||
|
||||
html,body
|
||||
height: auto
|
||||
width: 100%
|
||||
background-color: #F5F5F5
|
||||
|
||||
.clear:after
|
||||
content: ''
|
||||
display: block
|
||||
clear: both
|
||||
|
||||
.clear
|
||||
zoom:1
|
||||
|
||||
.margin
|
||||
margin: 0 auto
|
||||
|
||||
.fl
|
||||
float: left
|
||||
|
||||
.fr
|
||||
float: right
|
||||
|
||||
.text-center
|
||||
text-align: center !important
|
||||
|
||||
.text-right
|
||||
text-align: right !important
|
||||
|
||||
.relative
|
||||
position relative
|
||||
|
||||
.hide
|
||||
display: none
|
||||
|
||||
.show
|
||||
display: block
|
||||
|
||||
.bold
|
||||
font-weight: bold
|
||||
|
||||
.halfwidth
|
||||
width 50%
|
||||
|
||||
.allwidth
|
||||
width 100%
|
||||
|
||||
.spaceween
|
||||
justify-content: space-between
|
||||
|
||||
.ellipsis
|
||||
overflow: hidden
|
||||
text-overflow: ellipsis
|
||||
white-space: nowrap
|
||||
|
||||
.txtjustify
|
||||
text-align: justify
|
||||
&:after
|
||||
content: ''
|
||||
display: inline-block
|
||||
width: 100%
|
||||
|
||||
.mgt15
|
||||
margin-top: .15rem !important
|
||||
|
||||
.mgl20
|
||||
margin-left: .2rem !important
|
||||
|
||||
.mgb110
|
||||
margin-bottom: 1.1rem !important
|
||||
|
||||
.cred
|
||||
color $red !important
|
||||
|
||||
.bgred
|
||||
background-color: $red !important
|
||||
|
||||
.bgyellow
|
||||
background-color: $yellow !important
|
||||
|
||||
.bgblue
|
||||
background-color: $blue !important
|
||||
|
||||
.bggreen
|
||||
background-color: $green !important
|
||||
|
||||
.bggray
|
||||
background-color: $gray !important
|
||||
|
||||
.bgwhite
|
||||
background-color: #ffffff !important
|
||||
|
||||
.fxrow
|
||||
_fj()
|
||||
|
||||
.fxcol
|
||||
flex: 1
|
||||
overflow hidden
|
||||
|
||||
.visible
|
||||
overflow visible
|
||||
|
||||
[class^="icon-"]
|
||||
display: inline-block
|
||||
height: inherit
|
||||
|
||||
/** 公共样式 **/
|
||||
header
|
||||
_fj()
|
||||
height .86rem
|
||||
padding 0 .24rem
|
||||
background: $red
|
||||
span
|
||||
_font(.36rem,.86rem,#ffffff,bold,center)
|
||||
.content
|
||||
position: relative
|
||||
padding: 0 0.24rem
|
||||
.login-bg
|
||||
background: #ffffff center bottom / 100% auto no-repeat url(./images/bg.png)
|
||||
.loading-tips
|
||||
_font(.28rem,.53rem,#929292,,center)
|
||||
margin-bottom 1.2rem
|
||||
/** grid列表 **/
|
||||
.grid-wraper
|
||||
_fj(,flex-start)
|
||||
max-height 12rem
|
||||
overflow-y: auto
|
||||
.left_fixed
|
||||
flex 0 0 1.5rem
|
||||
.slide
|
||||
flex 1
|
||||
overflow-x scroll
|
||||
.layout-t
|
||||
border-collapse separate
|
||||
border-spacing 0
|
||||
text-align left
|
||||
vertical-align middle
|
||||
tr
|
||||
th,td
|
||||
white-space nowrap
|
||||
padding 0 .2rem
|
||||
border-bottom .1rem solid #f5f5f5
|
||||
th
|
||||
_font(.26rem,.98rem,#696969,bold)
|
||||
height 1.08rem
|
||||
background-color #d7d7d7
|
||||
td
|
||||
_font(.28rem,.98rem,$fc1)
|
||||
height 1.08rem
|
||||
background-color #ffffff
|
||||
a
|
||||
text-decoration underline
|
||||
color $red
|
||||
.layout-t tr.checked td
|
||||
background-color $red
|
||||
color #fff
|
||||
a
|
||||
color #fff
|
||||
.grid-wraper::-webkit-scrollbar, .slide::-webkit-scrollbar
|
||||
width 0
|
||||
height 0
|
||||
.left_layout_t
|
||||
width 100%
|
||||
min-width 1.68rem
|
||||
.sin_input
|
||||
width 1.6rem
|
||||
_font(.28rem,.6rem,#8a8a8a)
|
||||
padding 0 .1rem
|
||||
border 1px solid #a1a1a1
|
||||
border-radius 3px
|
||||
.layout-t tr.checked td .sin_input
|
||||
color #8a8a8a
|
||||
border 1px solid #ffffff
|
||||
.slide .layout-t
|
||||
min-width 5.34rem
|
||||
.click_div
|
||||
_font(.28rem,.6rem,#8a8a8a)
|
||||
padding 0 .1rem
|
||||
border 1px solid #a1a1a1
|
||||
border-radius 3px
|
||||
cursor pointer
|
||||
|
||||
/**detail**/
|
||||
.detail-title
|
||||
_font(.28rem,1,#696969)
|
||||
padding-top .25rem
|
||||
.detail-text
|
||||
_font(.3rem,1.2,#323232)
|
||||
padding-top .25rem
|
||||
.detail-input-panel
|
||||
display flex
|
||||
_wh(100%,.78rem)
|
||||
_font(.3rem,.78rem,#323232)
|
||||
margin-top .25rem
|
||||
.detail-input
|
||||
flex 9
|
||||
height inherit
|
||||
line-height inherit
|
||||
background #F4F4F4
|
||||
text-indent .28rem
|
||||
.detail-unit
|
||||
flex 1
|
||||
display inline-block
|
||||
.detail-col-1
|
||||
flex 9
|
||||
.detail-col-panel
|
||||
width 100%
|
||||
display flex
|
||||
overflow hidden
|
||||
.detail-input-col
|
||||
flex 3
|
||||
_wh(20%,inherit)
|
||||
line-height inherit
|
||||
background #F4F4F4
|
||||
text-indent .28rem
|
||||
.detail-unit-col
|
||||
flex 0.5
|
||||
display inline-block
|
||||
.detail-img-panel
|
||||
position relative
|
||||
margin-top .25rem
|
||||
width 3.02rem
|
||||
.detail-img
|
||||
_wh(3.02rem,auto)
|
||||
.detail-img-box
|
||||
_wh(3.02rem,3.02rem)
|
||||
|
||||
/** 按钮 **/
|
||||
.btn
|
||||
_font(.28rem,.6rem,#fff,,center)
|
||||
padding 0 .2rem
|
||||
background-color: $red
|
||||
border-radius: 5px
|
||||
cursor pointer
|
||||
&:disabled
|
||||
background-color: $gray
|
||||
.btn-disabled
|
||||
background-color: $gray
|
||||
.btn-active
|
||||
background-color: $red
|
||||
.btn-surround
|
||||
background-color: #ffffff
|
||||
border: 1px solid $red
|
||||
color: $red
|
||||
.filter-btn
|
||||
flex none
|
||||
min-width .8rem
|
||||
padding 0 .3rem
|
||||
.lx-icon
|
||||
flex 0 0 .44rem
|
||||
_wh(.44rem,.44rem)
|
||||
background-color: transparent
|
||||
cursor pointer
|
||||
.icon-radio
|
||||
_bis('./images/close.png',.44rem)
|
||||
.icon-radio-active
|
||||
_bis('./images/open.png',.44rem)
|
||||
|
||||
/** 输入框 **/
|
||||
.filter-wraper
|
||||
width 100%
|
||||
margin-bottom .15rem
|
||||
.bottom-filter
|
||||
width 100%
|
||||
position fixed
|
||||
bottom 1.11rem
|
||||
background-color #ffffff
|
||||
box-shadow 0 0 15px 0 rgba(160,160,160,0.9)
|
||||
.bottom-filter-tip
|
||||
_fj(space-between)
|
||||
padding .1rem 0 0 0
|
||||
// border-bottom .01rem solid #f0edf1
|
||||
&:last-child
|
||||
border-bottom none
|
||||
.filed-space
|
||||
margin 0 -.24rem
|
||||
.filed-pad
|
||||
padding 0 .24rem
|
||||
.filter-label
|
||||
flex none
|
||||
width 1.4rem
|
||||
_font(.3rem,.9rem,#323232,,justify)
|
||||
.filter-unit
|
||||
width .5rem
|
||||
margin-left .2rem
|
||||
_font(.26rem,.6rem,#323232)
|
||||
.filter-input
|
||||
display block
|
||||
width 100%
|
||||
min-width 0
|
||||
padding 0 .15rem
|
||||
_font(.3rem,.9rem,#606266)
|
||||
border .02rem solid #dcdfe6
|
||||
border-radius 4px
|
||||
background-color #fff
|
||||
// box-sizing border-box
|
||||
&:disabled
|
||||
color #929292
|
||||
background-color #f5f7fa
|
||||
border .02rem solid #e4e7ed
|
||||
cursor not-allowed
|
||||
.bottom-input
|
||||
width 100%
|
||||
_font(.28rem,.6rem,#929292,,center)
|
||||
background-color: #ececee
|
||||
.filter-warn
|
||||
display inline-block
|
||||
flex 0 0 .3rem
|
||||
_wh(.3rem,.3rem)
|
||||
border-radius 100%
|
||||
vertical-align middle
|
||||
.filter-scan
|
||||
display: block
|
||||
_ct()
|
||||
right 0
|
||||
_wh(.9rem,.9rem)
|
||||
padding .24rem
|
||||
.icon-scan
|
||||
flex 0 0 .42rem
|
||||
_bis('./images/saoma.png',.42rem)
|
||||
.filter-scan-input
|
||||
// padding-right 1.5rem
|
||||
// border-bottom 1px solid #d7d7d7
|
||||
.mount-bg
|
||||
padding .25rem
|
||||
background: #ffffff center bottom / 100% auto no-repeat url(./images/bg4.png)
|
||||
.modal-message
|
||||
padding .5rem
|
||||
font-size .3rem
|
||||
line-height 1.5
|
||||
color #666
|
||||
.tip-h1
|
||||
_font(.34rem,.54rem,#323232)
|
||||
.tip-h2
|
||||
_font(.28rem,.5rem,#464646)
|
||||
|
||||
/** 提交栏 **/
|
||||
.submit-bar
|
||||
_fj()
|
||||
position fixed
|
||||
bottom 0
|
||||
width 100%
|
||||
background-color #fff
|
||||
box-shadow 0 0 20px 0 rgba(160,160,160,0.9)
|
||||
.submit-button
|
||||
flex 1
|
||||
line-height .8rem
|
||||
margin .15rem
|
||||
.submit-button1
|
||||
flex 0 0 2.5rem
|
||||
line-height 1.1rem
|
||||
border-radius 0
|
||||
.icon-subarrow
|
||||
flex 0 0 .22rem
|
||||
_wh(.22rem,.46rem)
|
||||
_bis('./images/triangle.png',.22rem)
|
||||
.icon_subarrow_gray
|
||||
_bis('./images/triangle-gray.png',.22rem)
|
||||
.qty_tip
|
||||
_font(.26rem,1,#323232)
|
||||
vertical-align: middle
|
||||
.qty_num
|
||||
display inline-block
|
||||
_font(.3rem,1,$red)
|
||||
vertical-align: middle
|
||||
max-width 2.6rem
|
||||
overflow hidden
|
||||
|
||||
// vant toast style
|
||||
.van-loading span, .van-toast__text
|
||||
color #ffffff !important
|
||||
// 显示框bg
|
||||
.disabled-bg
|
||||
color #929292
|
||||
background-color #f5f7fa
|
||||
border 1px solid #e4e7ed
|
||||
cursor not-allowed
|
||||
|
||||
.van-toast
|
||||
background-color rgba(155,155,155,.88)
|
||||
|
||||
// 弹窗 + 选择器
|
||||
.msg_wrapper
|
||||
position fixed
|
||||
top 0
|
||||
bottom 0
|
||||
left 0
|
||||
right 0
|
||||
text-align center
|
||||
z-index 100
|
||||
&::after
|
||||
content ""
|
||||
display inline-block
|
||||
height 100%
|
||||
width 0
|
||||
vertical-align middle
|
||||
.msg_box
|
||||
display inline-block
|
||||
width 90%
|
||||
max-width 420px
|
||||
padding .2rem
|
||||
vertical-align middle
|
||||
background-color #fff
|
||||
border-radius 4px
|
||||
border 1px solid #ebeef5
|
||||
box-shadow 0 2px 12px 0 rgb(0 0 0 / 10%)
|
||||
overflow hidden
|
||||
backface-visibility hidden
|
||||
.input_item
|
||||
width 100%
|
||||
border-radius 4px
|
||||
border 1px solid #DCDFE6
|
||||
_font(14px,40px,#606266)
|
||||
text-indent 25px
|
||||
.mask
|
||||
position fixed
|
||||
top 0
|
||||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
opacity .2
|
||||
background #000
|
||||
z-index 99
|
||||
.msg_item
|
||||
height 50px
|
||||
line-height 50px
|
||||
.label_item
|
||||
display inline-block
|
||||
width 90px
|
||||
_font(16px,inherit,#333)
|
||||
.from_item
|
||||
display inline-block
|
||||
width calc(100% - 100px)
|
||||
_font(14px,inherit,#606266)
|
||||
.from_item .el-select
|
||||
width 100%
|
||||
.from_item .el-input
|
||||
font-size 14px
|
||||
.from_item .el-input__inner
|
||||
height 40px
|
||||
line-height inherit
|
||||
.el-select-dropdown__item span
|
||||
font-size 14px !important
|
||||
.el-select .el-input .el-select__caret
|
||||
line-height 40px
|
||||
.msg_btns
|
||||
height 35px
|
||||
line-height 35px
|
||||
width 100%
|
||||
max-width 300px
|
||||
margin 20px auto 0
|
||||
_fj()
|
||||
.msg_btn
|
||||
width 80px
|
||||
height 35px
|
||||
line-height 35px
|
||||
font-size 14px
|
||||
color #fff
|
||||
background-color #d7592f
|
||||
border-radius 5px
|
||||
text-align center
|
||||
&:disabled
|
||||
background-color $gray
|
||||
|
||||
/** 选择器 */
|
||||
.el-select
|
||||
width 100%
|
||||
.el-input
|
||||
font-size .26rem
|
||||
.el-input__inner
|
||||
line-height .6rem
|
||||
height .6rem
|
||||
.el-select .el-input .el-select__caret
|
||||
line-height .6rem
|
||||
.el-radio__label
|
||||
font-size: .28rem
|
||||
padding-left: .1rem
|
||||
vertical-align: top
|
||||
.el-radio__inner
|
||||
_wh(.28rem,.28rem)
|
||||
.el-radio__inner::after
|
||||
_wh(.08rem,.08rem)
|
||||
.el-radio__input.is-checked .el-radio__inner
|
||||
border-color: $red
|
||||
background: $red
|
||||
.el-radio__input.is-checked+.el-radio__label
|
||||
color#323232
|
||||
.el-radio__inner:hover
|
||||
border-color: $red
|
||||
Reference in New Issue
Block a user