hi-link-ui
Version:
## Project setup ``` npm install ```
1 lines • 8.92 kB
CSS
body{overflow:auto;-webkit-overflow-scrolling:touch}#app{height:100%;font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center}.logo{margin-top:3.5rem}.item1-div{padding-left:1rem;text-align:left;line-height:4.125rem}.item2-div,.item3-div{padding:.8125rem 1rem;text-align:left}.item-logo{width:1.5rem;height:1.5rem;float:right;padding:1.25rem 1rem}.model-big-item1{text-align:left;padding-left:1rem;line-height:5.5rem}.model-big-item2{text-align:center;padding:1.125rem 0}.model-big-item2:last-child{margin-top:.125rem}.model-big-item3{width:3.75rem;height:3.75rem;float:right;padding:.875rem .25rem;line-height:5.5rem}.item3-rang{width:100%;margin-top:1.25rem}.dialog-enter[data-v-3ca63e30],.dialog-leave-active[data-v-3ca63e30]{transform:translateY(100%)}.dialog-enter-active[data-v-3ca63e30],.dialog-leave-active[data-v-3ca63e30]{transition:all .3s}.dropdown-enter[data-v-d35a5f80],.dropdown-leave-active[data-v-d35a5f80]{transform:translateY(-80%)}.dropdown-enter-active[data-v-d35a5f80],.dropdown-leave-active[data-v-d35a5f80]{transition:all .4s}.dropdown[data-v-d35a5f80]{margin-top:8px}.dropdown li:last-child .dropdown-item[data-v-d35a5f80]{border-bottom:none}.dropdown li[data-v-d35a5f80]:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.dropdown li[data-v-d35a5f80]:first-child{border-top-left-radius:8px;border-top-right-radius:8px}ul[data-v-d35a5f80]{list-style:none;margin:0;padding:0}.loading[data-v-2d00f964]{padding:1.5rem;position:fixed;bottom:1rem;left:1rem;right:1rem;z-index:999;line-height:2.5rem;text-align:left}.loading-icon[data-v-2d00f964]{width:2.5rem;height:2.5rem;float:right}.loading-enter[data-v-2d00f964],.loading-leave-active[data-v-2d00f964]{transform:translateY(100%)}.loading-enter-active[data-v-2d00f964],.loading-leave-active[data-v-2d00f964]{transition:all .3s}.picker-enter[data-v-5dadcc32],.picker-leave-active[data-v-5dadcc32]{transform:translateY(100%)}.picker-enter-active[data-v-5dadcc32],.picker-leave-active[data-v-5dadcc32]{transition:all .3s}input[type=range][data-v-3239eb63]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;width:1.56rem;height:1.56rem;border-radius:50%;position:relative;top:-.625rem;background:#fff;border:0 solid rgba(0,0,0,.04);pointer-events:none;box-shadow:0 3px 8px 0 rgb(0 0 0/15%),0 1px 1px 0 rgb(0 0 0/16%)}.swipe[data-v-33f94530]{width:100%;overflow:hidden}.indicators[data-v-33f94530]{margin-top:10px;font-size:0;text-align:center}.indicators li[data-v-33f94530]{width:7px;height:7px;display:inline-block;background:rgba(0,0,0,.1);border-radius:50%;margin-left:5px}.now[data-v-33f94530]{width:12px;border-radius:12px;background:#0a59f7}.hi-row{display:flex;width:100%}.hi-row-line .hi-col,[data-theme=light] .hi-row-line .hi-col{border-left:.01563rem solid rgba(0,0,0,.2)}[data-theme=dark] .hi-row-line .hi-col{border-left:.01563rem solid hsla(0,0%,100%,.2)}.hi-row-line .hi-col:first-child{border-left:none}.hi-row .hi-col:first-child{padding-left:0}.hi-row .hi-col:last-child{padding-right:0}.hi-col-0{flex:0}.hi-col-1{flex:1}.hi-col-2{flex:2}.hi-col-3{flex:3}.hi-col-4{flex:4}.hi-col-5{flex:5}.hi-col-6{flex:6}.bg-color,[data-theme=light] .bg-color{background-color:#f6f6f5}[data-theme=dark] .bg-color{background-color:#000}.text-color-one,[data-theme=light] .text-color-one{color:rgba(0,0,0,.9)}[data-theme=dark] .text-color-one{color:hsla(0,0%,100%,.9)}.text-color-two,[data-theme=light] .text-color-two{color:rgba(0,0,0,.6)}[data-theme=dark] .text-color-two{color:hsla(0,0%,100%,.6)}.text-color-three,[data-theme=light] .text-color-three{color:rgba(0,0,0,.38)}[data-theme=dark] .text-color-three{color:hsla(0,0%,100%,.38)}.text-color-dialog,[data-theme=light] .text-color-dialog{color:rgba(0,0,0,.9)}[data-theme=dark] .text-color-dialog{color:hsla(0,0%,100%,.9)}.text-color-one-contrary{color:#fff}.text-color-two-contrary{color:hsla(0,0%,100%,.6)}.text-color-three-contrary,.text-color-tips{color:hsla(0,0%,100%,.38)}.widget-bg-highlight,.widget-bg-highlight-click,[data-theme=light] .widget-bg-highlight,[data-theme=light] .widget-bg-highlight-click{background-color:#007dff}[data-theme=dark] .widget-bg-highlight,[data-theme=dark] .widget-bg-highlight-click{background-color:#006cdf}.widget-bg,[data-theme=light] .widget-bg{background-color:rgba(0,0,0,.1)}[data-theme=dark] .widget-bg{background-color:hsla(0,0%,100%,.1)}.card{box-shadow:0 .2rem .37rem rgba(0,0,0,.03);border-radius:.5rem}.card,[data-theme=light] .card{background-color:#fff}[data-theme=dark] .card{background-color:#262626}.mask{position:fixed;top:0;left:0;bottom:0;right:0;z-index:999}.mask,[data-theme=dark] .mask,[data-theme=light] .mask{background-color:rgba(0,0,0,.2)}.hi-color-1{color:#3f56ea}.hi-color-2{color:#01aaef}.hi-color-3{color:#00bfc9}.hi-color-4{color:#47cc47}.hi-color-5{color:#8bd600}.hi-color-6{color:#892be1}.hi-color-7{color:#e40079}.hi-color-8{color:#fb2b2d}.hi-color-9{color:#ff7500}.hi-color-10{color:#ff9700}.hi-color-11{color:#ffbe00}.hi-btn-color-red{color:#e64548}.hi-btn-color-blue{color:#3f97e9}.toast{width:100%;height:3rem;position:fixed;line-height:3rem}.toast,[data-theme=light] .toast{background-color:rgba(232,64,38,.15);color:#fb2a2d}[data-theme=dark] .toast{background-color:#372222;color:#e64548}.toast-icon{width:1.5rem;height:1.5rem;float:left;margin:.75rem 1rem;background-repeat:no-repeat;background-size:100% 100%}.toast-msg{float:left;font-size:1rem}.header{width:100%;height:3.5rem;line-height:3.5rem;position:fixed;top:0;z-index:999}.back{width:1.5rem;height:1.5rem;float:left;margin:1rem 0 0 1rem}.content{float:left;margin:0 0 0 1rem;font-size:1.5rem;font-weight:500}.more{width:1.5rem;height:1.5rem;float:right;margin:1rem 1rem 0 0}.img-box{width:100%;text-align:center}.img-logo-big{width:15.75rem;height:15.75rem}.img-logo-mini{width:4.375rem;height:1.125rem}.dropdown{width:100%;overflow-y:auto;max-height:15rem;border-radius:.5rem;box-shadow:.2rem .37rem .6rem rgba(0,0,0,.2);position:relative;z-index:999}.dropdown,[data-theme=light] .dropdown{background-color:#fff}[data-theme=dark] .dropdown{background-color:#404040}.dropdown-item{text-align:left;margin:0 1rem;height:3rem;line-height:3rem;font-size:1rem}.dropdown-item,[data-theme=light] .dropdown-item{border-bottom:.015rem solid rgba(0,0,0,.2)}[data-theme=dark] .dropdown-item{border-bottom:.015rem solid hsla(0,0%,100%,.2)}.dropdown-item-select,[data-theme=light] .dropdown-item-select{background-color:rgba(0,125,255,.1)}[data-theme=dark] .dropdown-item-select{background-color:rgba(0,108,222,.1)}.text-title-size{font-size:1.5rem}.model-big-title-size{font-size:1.125rem}.model-content-title-size{font-size:1.5rem}.model-title-main-size{font-size:1rem}.model-title-subtitle-size{font-size:.75rem}.text-btn-size{font-size:.875rem}.text-tab-title-size{font-size:1.125rem}.list-title-main-size{font-size:.9375rem}.list-title-subtitle-size{font-size:.75rem}.select-item-title-size{font-size:1rem}.dialog-content-size{font-size:.875rem}input[type=range]{-webkit-appearance:none;-moz-appearance:none;background:-webkit-linear-gradient(#0a59f7,#0a59f7) no-repeat #fff;border-radius:.625rem}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{height:.1875rem;width:100%;background:rgba(0,0,0,.1)}.dialog{padding:1.5rem 1.5rem 0 1.5rem;position:fixed;left:1rem;right:1rem;z-index:999}.dialog-title{text-align:left;font-weight:700}.dialog-body{margin-top:.6rem;text-align:left}.dialog-foot{margin-top:.6rem;padding:.8rem 0;text-align:center}.picker-column{overflow:hidden}.picker__mask{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background-repeat:no-repeat;background-position:top,bottom;transform:translateZ(0);pointer-events:none}.picker__mask,[data-theme=light] .picker__mask{background-image:linear-gradient(180deg,hsla(0,0%,100%,.9),hsla(0,0%,100%,.4)),linear-gradient(0deg,hsla(0,0%,100%,.9),hsla(0,0%,100%,.4))}[data-theme=dark] .picker__mask{background-image:linear-gradient(180deg,rgba(38,38,38,.9),rgba(38,38,38,.4)),linear-gradient(0deg,rgba(38,38,38,.9),rgba(38,38,38,.4))}.picker-column__item{display:flex;align-items:center;justify-content:center;padding:0 .25rem;color:#000;height:2.75rem}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:2.75rem}.picker-column__wrapper{transition-timing-function:cubic-bezier(.23,1,.68,1);list-style:none;padding:0;margin:0}.switch{width:3.125rem;padding:.125rem}.switch,.switch-btn{height:1.25rem;border-radius:1.25rem}.switch-btn{width:1.25rem;background-color:#fff}.switch-on,[data-theme=light] .switch-on{background-color:#007dff}[data-theme=dark] .switch-on{background-color:#006cde}.switch-off,[data-theme=light] .switch-off{background-color:rgba(0,0,0,.1)}[data-theme=dark] .switch-off{background-color:hsla(0,0%,100%,.4)}.annular{margin:1.25rem auto}