mirror of https://github.com/go-sonic/sonic.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
5.6 KiB
CSS
1 line
5.6 KiB
CSS
2 years ago
|
.verte{position:relative;display:flex;justify-content:center}.verte *{box-sizing:border-box}.verte--loading{opacity:0}.verte__guide{width:24px;height:24px;padding:0;border:0;background:transparent}.verte__guide:focus{outline:0}.verte__guide svg{width:100%;height:100%;fill:inherit}.verte__menu{flex-direction:column;justify-content:center;align-items:stretch;width:250px;border-radius:6px;background-color:#fff;will-change:transform;box-shadow:0 8px 15px rgba(0,0,0,.1)}.verte__menu:focus{outline:none}.verte__menu-origin{display:none;position:absolute;z-index:10}.verte__menu-origin--active{display:flex}.verte__menu-origin--static{position:static;z-index:auto}.verte__menu-origin--top{bottom:50px}.verte__menu-origin--bottom{top:50px}.verte__menu-origin--right{right:0}.verte__menu-origin--left{left:0}.verte__menu-origin--center{position:fixed;top:0;left:0;width:100vw;height:100vh;justify-content:center;align-items:center;background-color:rgba(0,0,0,.1)}.verte__menu-origin:focus{outline:none}.verte__controller{padding:0 20px 20px}.verte__recent{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;width:100%}.verte__recent-color{margin:4px;width:27px;height:27px;border-radius:50%;background-color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.1);background-image:linear-gradient(45deg,rgba(112,128,144,.5) 25%,transparent 0),linear-gradient(45deg,transparent 75%,rgba(112,128,144,.5) 0),linear-gradient(-45deg,rgba(112,128,144,.5) 25%,transparent 0),linear-gradient(-45deg,transparent 75%,rgba(112,128,144,.5) 0);background-size:6px 6px;background-position:0 0,3px -3px,0 3px,-3px 0;overflow:hidden}.verte__recent-color:after{content:"";display:block;width:100%;height:100%;background-color:currentColor}.verte__value{padding:.6em;width:100%;border:1px solid #708090;border-radius:6px 0 0 6px;text-align:center;font-size:12px;-webkit-appearance:none;-moz-appearance:textfield}.verte__value:focus{outline:none;border-color:#1a3aff}.verte__icon{width:20px;height:20px}.verte__icon--small{width:12px;height:12px}.verte__input{padding:5px;margin:0 3px;min-width:0;text-align:center;border-width:0 0 1px 0;-webkit-appearance:none;appearance:none;-moz-appearance:textfield}.verte__input::-webkit-inner-spin-button,.verte__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.verte__inputs{display:flex;font-size:16px;margin-bottom:5px}.verte__draggable{border-radius:6px 6px 0 0;height:8px;width:100%;cursor:-webkit-grab;cursor:grab;background:linear-gradient(90deg,#fff 2px,transparent 1%) 50%,linear-gradient(#fff 2px,transparent 1%) 50%,rgba(112,128,144,.2);background-size:4px 4px}.verte__model,.verte__submit{position:relative;display:inline-flex;justify-content:center;align-items:center;padding:1px;border:0;text-align:center;cursor:pointer;background-color:transparent;font-weight:700;color:#708090;fill:#708090;outline:none}.verte__model:hover,.verte__submit:hover{fill:#1a3aff;color:#1a3aff}.verte__close{position:absolute;top:1px;right:1px;z-index:1;display:flex;justify-content:center;align-items:center;padding:4px;cursor:pointer;border-radius:50%;border:0;transform:translate(50%,-50%);background-color:rgba(0,0,0,.4);fill:#fff;outline:none;box-shadow:1px 1px 1px rgba(0,0,0,.2)}.verte__close:hover{background-color:rgba(0,0,0,.6)}.verte-picker{width:100%;margin:0 auto 10px;display:flex;flex-direction:column}.verte-picker--wheel{margin-top:20px}.verte-picker__origin{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;margin:0 auto;overflow:hidden}.verte-picker__slider{margin:20px 20px 0}.verte-picker__canvas{display:block}.verte-picker__cursor{position:absolute;top:0;left:0;margin:-6px;width:12px;height:12px;border:1px solid #fff;border-radius:50%;will-change:transform;pointer-events:none;background-color:transparent;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px rgba(0,0,0,.3),0 0 1px 2px rgba(0,0,0,.4)}.slider,.verte-picker__input{display:flex;margin-bottom:10px}.slider{position:relative;align-items:center;box-sizing:border-box;font-size:20px}.slider--dragging .slider-label,.slider:hove
|