loit-web-component-gx/static/theme/Red/color-picker.css

广西时代凌宇前端组件库

.el-color-predefine{display:-webkit-box;display:-ms-flexbox;display:flex;font-size:0.12rem;margin-top:0.08rem;width:2.8rem }.el-color-predefine__colors{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-wrap:wrap;flex-wrap:wrap }.el-color-predefine__color-selector{margin:0 0 0.08rem 0.08rem;width:0.2rem;height:0.2rem;border-radius:0.04rem;cursor:pointer }.el-color-predefine__color-selector:nth-child(10n+1){margin-left:0 }.el-color-predefine__color-selector.selected{-webkit-box-shadow:0 0 0.03rem 0.02rem #e1806f;box-shadow:0 0 0.03rem 0.02rem #e1806f }.el-color-predefine__color-selector>div{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;border-radius:0.03rem }.el-color-predefine__color-selector.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) }.el-color-hue-slider{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;width:2.8rem;height:0.12rem;background-color:red;padding:0 0.02rem }.el-color-hue-slider__bar{position:relative;background:-webkit-gradient(linear,left top,right top,from(red),color-stop(17%,#ff0),color-stop(33%,#0f0),color-stop(50%,#0ff),color-stop(67%,#00f),color-stop(83%,#f0f),to(red));background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%);height:100% }.el-color-hue-slider__thumb{position:absolute;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;left:0;top:0;width:0.04rem;height:100%;border-radius:0.01rem;background:#fff;border:1px solid #f0f0f0;-webkit-box-shadow:0 0 0.02rem rgba(0,0,0,.6);box-shadow:0 0 0.02rem rgba(0,0,0,.6);z-index:1 }.el-color-hue-slider.is-vertical{width:0.12rem;height:1.8rem;padding:0.02rem 0 }.el-color-hue-slider.is-vertical .el-color-hue-slider__bar{background:-webkit-gradient(linear,left top,left bottom,from(red),color-stop(17%,#ff0),color-stop(33%,#0f0),color-stop(50%,#0ff),color-stop(67%,#00f),color-stop(83%,#f0f),to(red));background:linear-gradient(to bottom,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%) }.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb{left:0;top:0;width:100%;height:0.04rem }.el-color-svpanel{position:relative;width:2.8rem;height:1.8rem }.el-color-svpanel__black,.el-color-svpanel__white{position:absolute;top:0;left:0;right:0;bottom:0 }.el-color-svpanel__white{background:-webkit-gradient(linear,left top,right top,from(#fff),to(rgba(255,255,255,0)));background:linear-gradient(to right,#fff,rgba(255,255,255,0)) }.el-color-svpanel__black{background:-webkit-gradient(linear,left bottom,left top,from(#000),to(transparent));background:linear-gradient(to top,#000,transparent) }.el-color-svpanel__cursor{position:absolute }.el-color-svpanel__cursor>div{cursor:head;width:0.04rem;height:0.04rem;-webkit-box-shadow:0 0 0 1.0.05rem #fff,inset 0 0 0.01rem 0.01rem rgba(0,0,0,.3),0 0 0.01rem 0.02rem rgba(0,0,0,.4);box-shadow:0 0 0 1.0.05rem #fff,inset 0 0 0.01rem 0.01rem rgba(0,0,0,.3),0 0 0.01rem 0.02rem rgba(0,0,0,.4);border-radius:50%;-webkit-transform:translate(-0.02rem,-0.02rem);transform:translate(-0.02rem,-0.02rem) }.el-color-alpha-slider{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;width:2.8rem;height:0.12rem;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) }.el-color-alpha-slider__bar{position:relative;background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),to(white));background:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 100%);height:100% }.el-color-alpha-slider__thumb{position:absolute;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;left:0;top:0;width:0.04rem;height:100%;border-radius:0.01rem;background:#fff;border:1px solid #f0f0f0;-webkit-box-shadow:0 0 0.02rem rgba(0,0,0,.6);box-shadow:0 0 0.02rem rgba(0,0,0,.6);z-index:1 }.el-color-alpha-slider.is-vertical{width:0.2rem;height:1.8rem }.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar{background:-webkit-gradient(linear,left top,left bottom,from(rgba(255,255,255,0)),to(white));background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%) }.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb{left:0;top:0;width:100%;height:0.04rem }.el-color-dropdown{width:3rem }.el-color-dropdown__main-wrapper{margin-bottom:0.06rem }.el-color-dropdown__main-wrapper::after{content:"";display:table;clear:both }.el-color-dropdown__btns{margin-top:0.06rem;text-align:right }.el-color-dropdown__value{float:left;line-height:0.26rem;font-size:0.12rem;color:#000;width:1.6rem }.el-color-dropdown__btn{border:1px solid #dcdcdc;color:#333;line-height:0.24rem;border-radius:0.02rem;padding:0 0.2rem;cursor:pointer;background-color:transparent;outline:0;font-size:0.12rem }.el-color-dropdown__btn[disabled]{color:#ccc;cursor:not-allowed }.el-color-dropdown__btn:hover{color:#e1806f;border-color:#e1806f }.el-color-dropdown__link-btn{cursor:pointer;color:#e1806f;text-decoration:none;padding:0.15rem;font-size:0.12rem }.el-color-dropdown__link-btn:hover{color:tint(primary,20%) }.el-color-picker{display:inline-block;position:relative;line-height:normal;height:0.4rem }.el-color-picker.is-disabled .el-color-picker__trigger{cursor:not-allowed }.el-color-picker--medium{height:0.36rem }.el-color-picker--medium .el-color-picker__trigger{height:0.36rem;width:0.36rem }.el-color-picker--medium .el-color-picker__mask{height:0.34rem;width:0.34rem }.el-color-picker--small{height:0.32rem }.el-color-picker--small .el-color-picker__trigger{height:0.32rem;width:0.32rem }.el-color-picker--small .el-color-picker__mask{height:0.3rem;width:0.3rem }.el-color-picker--small .el-color-picker__empty,.el-color-picker--small .el-color-picker__icon{-webkit-transform:translate3d(-50%,-50%,0) scale(.8);transform:translate3d(-50%,-50%,0) scale(.8) }.el-color-picker--mini{height:0.28rem }.el-color-picker--mini .el-color-picker__trigger{height:0.28rem;width:0.28rem }.el-color-picker--mini .el-color-picker__mask{height:0.26rem;width:0.26rem }.el-color-picker--mini .el-color-picker__empty,.el-color-picker--mini .el-color-picker__icon{-webkit-transform:translate3d(-50%,-50%,0) scale(.8);transform:translate3d(-50%,-50%,0) scale(.8) }.el-color-picker__mask{height:0.38rem;width:0.38rem;border-radius:0.04rem;position:absolute;top:0.01rem;left:0.01rem;z-index:1;cursor:not-allowed;background-color:rgba(255,255,255,.7) }.el-color-picker__trigger{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;height:0.4rem;width:0.4rem;padding:0.04rem;border:1px solid #e6e6e6;border-radius:0.04rem;font-size:0;position:relative;cursor:pointer }.el-color-picker__color{position:relative;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #999;border-radius:0.02rem;width:100%;height:100%;text-align:center }.el-color-picker__color.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) }.el-color-picker__color-inner{position:absolute;left:0;top:0;right:0;bottom:0 }.el-color-picker__empty,.el-color-picker__icon{top:50%;left:50%;font-size:0.12rem;position:absolute }.el-color-picker__empty{color:#999;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0) }.el-color-picker__icon{display:inline-block;width:100%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);color:#fff;text-align:center }.el-color-picker__panel{position:absolute;z-index:10;padding:0.06rem;-webkit-box-sizing:content-box;box-sizing:content-box;background-color:#fff;border:1px solid #ebeef5;border-radius:0.04rem;-webkit-box-shadow:0 0.02rem 0.12rem 0 rgba(0,0,0,.1);box-shadow:0 0.02rem 0.12rem 0 rgba(0,0,0,.1) }