adui
Version:
<div> <img src="https://wxa.wxs.qq.com/mpweb/delivery/legacy/wxadtouch/upload/t1/od834zef_52939fc6.png" style="margin:40px 0 0 -8px; background-color: #fcfcfc; box-shadow: none;" /> </div>
2 lines (1 loc) • 4.4 kB
CSS
.adui-cp{display:inline-block}.adui-cp-input{margin-left:8px}.adui-cp-prefix{padding-left:8px;font-size:12px;color:var(--gray-600);font-weight:500;cursor:text}.adui-cp-picker.adui-button-base{display:inline-block;vertical-align:top;padding:4px}.adui-cp-picker>.adui-button-content{display:block;width:100%;height:100%}.adui-cp-picker>.adui-button-content i{display:block;width:100%;height:100%;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.1) inset}.adui-cp-popup{width:180px}.adui-cp-popup-result{display:flex;align-items:center;padding:12px 10px;box-shadow:0 -1px 0 0 #f3f3f3 inset}.adui-cp-popup-result>i{margin-right:12px;width:20px;height:20px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.1) inset}.adui-cp-popup .adui-cp-input{flex:1;margin-left:0;width:auto}.adui-cp-collapse{box-shadow:0 -1px 0 0 #f3f3f3 inset}.adui-cp-collapse:last-child{box-shadow:none}.adui-cp-collapse-header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adui-cp-collapse-header-icon{transform:rotate(-180deg);transition:var(--motion-duration-base) var(--ease-in-out) all}.adui-cp-collapse-content{padding:0 10px 10px}.adui-cp-collapse_collapsed .adui-cp-collapse-header-icon{transform:rotate(0deg)}.adui-cp-recent,.adui-cp-standard{display:flex;flex-wrap:wrap;overflow:hidden}.adui-cp-recent>i,.adui-cp-standard>i{flex-basis:calc(14.2857142857% - 1px);display:inline-block;margin-right:1px;margin-bottom:1px;cursor:pointer;box-shadow:0 0 0 1px rgba(0,0,0,.1) inset}.adui-cp-recent>i::before,.adui-cp-standard>i::before{content:"";display:block;padding-top:100%}.adui-cp-recent>i:hover,.adui-cp-standard>i:hover{box-shadow:0 0 0 1px #fff inset,0 0 0 2px rgba(0,0,0,.1) inset}.adui-cp-recent>i.adui-cp-standard-item_selected,.adui-cp-standard>i.adui-cp-standard-item_selected{box-shadow:0 0 0 2px #fff inset,0 0 0 3px rgba(0,0,0,.1) inset}.adui-cp-recent>i:first-child,.adui-cp-standard>i:first-child{border-top-left-radius:2px}.adui-cp-recent>i:nth-last-child(7),.adui-cp-standard>i:nth-last-child(7){border-bottom-left-radius:2px}.adui-cp-recent>i:nth-child(7),.adui-cp-standard>i:nth-child(7){border-top-right-radius:2px}.adui-cp-recent>i:last-child,.adui-cp-standard>i:last-child{border-bottom-right-radius:2px}.adui-cp-recent>i:first-child{border-top-left-radius:2px;border-bottom-left-radius:2px}.adui-cp-recent>i:last-child{border-top-right-radius:2px;border-bottom-right-radius:2px}.adui-cp-slider{flex:1}.adui-cp-slider-wrapper{display:flex;align-items:center}.adui-cp-slider-label{margin-right:6px;width:9px;font-size:12px}.adui-cp-slider .adui-slider{margin-right:0;height:20px}.adui-cp-slider .adui-slider-handle{margin-top:-1px;margin-left:-4px;width:8px;height:14px;border-radius:4px;box-shadow:0 2px 4px 0 rgba(0,0,0,.13),0 1px 2px 0 rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.08);transform:scale(1)}.adui-cp-slider .adui-slider-rail,.adui-cp-slider .adui-slider-step{height:12px}.adui-cp-slider .adui-slider-rail{box-shadow:0 0 0 1px rgba(0,0,0,.06) inset}.adui-cp-slider .adui-slider-track{opacity:0;background-color:rgba(0,0,0,0)}.adui-cp-slider_h .adui-slider-rail{background-image:linear-gradient(to right, rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)}.adui-cp-palette{position:relative;margin-bottom:4px;height:90px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adui-cp-palette i{position:absolute;width:14px;height:14px;border:3px solid #fff;border-radius:100%;box-shadow:0 0 4px 0 rgba(0,0,0,.3)}.adui-cp-palette-s,.adui-cp-palette-b{position:absolute;bottom:0;left:0;width:100%;height:100%}.adui-cp-palette-s{background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}.adui-cp-palette-b{background-image:linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0))}.adui-cp-large .adui-cp-picker{width:42px;height:42px}.adui-cp-large .adui-cp-input{width:102px}.adui-cp-medium .adui-cp-picker{width:36px;height:36px}.adui-cp-medium .adui-cp-input{width:96px}.adui-cp-small .adui-cp-picker{width:30px;height:30px}.adui-cp-small .adui-cp-input{width:90px}.adui-cp-mini .adui-cp-picker{width:26px;height:26px}.adui-cp-mini .adui-cp-input{width:84px}