NebulaPanel - Control Interface

✏️ Editing: flatsome-swatches-frontend.css

@charset "UTF-8";.ux-swatch{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-shadow:0 0 0 .07rem #d5d5d5;box-shadow:0 0 0 .07rem #d5d5d5;cursor:pointer;position:relative;white-space:nowrap;margin:5px 10px 5px 0}.ux-swatch:hover:not(.selected):not(.disabled){-webkit-box-shadow:0 0 0 .07rem #999;box-shadow:0 0 0 .07rem #999}.ux-swatch.selected{-webkit-box-shadow:0 0 0 .1rem #d26e4b;box-shadow:0 0 0 .1rem #d26e4b}.ux-swatch.disabled{cursor:default;opacity:.5}.ux-swatch__color{height:100%;width:100%}.ux-swatch__color--single-color{background:var(--swatch-color)}.ux-swatch__color--dual-color{background:-o-linear-gradient(315deg, var(--swatch-color) 50%, var(--swatch-color-secondary) 50%);background:linear-gradient(135deg, var(--swatch-color) 50%, var(--swatch-color-secondary) 50%)}.ux-swatch--image,.ux-swatch--color{width:30px;height:30px;padding:2px}.ux-swatch--label{min-width:30px;min-height:30px;padding:0 8px;font-size:14px}.ux-swatch--image.disabled:before,.ux-swatch--color.disabled:before{position:absolute;content:"";width:100%;height:1px;background:#000 !important;left:0;top:50%;right:0;bottom:0;border:0;margin:0 !important;padding:0 !important;min-width:auto;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}.ux-swatch--label.disabled{background:-webkit-gradient(linear, right bottom, left top, from(transparent), color-stop(black), to(transparent));background:-o-linear-gradient(bottom right, transparent calc(50% - .031rem), black, transparent calc(50% + 0.031rem));background:linear-gradient(to top left, transparent calc(50% - .031rem), black, transparent calc(50% + 0.031rem))}.dark .ux-swatch--image.disabled:before,.dark .ux-swatch--color.disabled:before{background:#fff !important}.dark .ux-swatch--label.disabled{background:-webkit-gradient(linear, right bottom, left top, from(transparent), color-stop(white), to(transparent));background:-o-linear-gradient(bottom right, transparent calc(50% - .031rem), white, transparent calc(50% + 0.031rem));background:linear-gradient(to top left, transparent calc(50% - .031rem), white, transparent calc(50% + 0.031rem))}.ux-swatch--image .ux-swatch__text,.ux-swatch--color .ux-swatch__text{display:none}.ux-swatches{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.ux-swatches--rounded *{border-radius:2px}.ux-swatches--circle *{border-radius:50%}.ux-swatches--circle .ux-swatch--label{border-radius:100px}.ux-swatches--circle .ux-swatch__color--dual-color{background:-webkit-gradient(linear, left top, left bottom, color-stop(50%, var(--swatch-color)), color-stop(50%, var(--swatch-color-secondary)));background:-o-linear-gradient(top, var(--swatch-color) 50%, var(--swatch-color-secondary) 50%);background:linear-gradient(180deg, var(--swatch-color) 50%, var(--swatch-color-secondary) 50%)}.ux-swatches--x-small .ux-swatch--image,.ux-swatches--x-small .ux-swatch--color{width:15px;height:15px}.ux-swatches--small .ux-swatch--image,.ux-swatches--small .ux-swatch--color{width:20px;height:20px}.ux-swatches--large .ux-swatch--image,.ux-swatches--large .ux-swatch--color{width:45px;height:45px}.ux-swatches--x-large .ux-swatch--image,.ux-swatches--x-large .ux-swatch--color{width:70px;height:70px}.ux-swatches--x-small .ux-swatch--label{min-width:15px;min-height:15px;padding:2px 8px}.ux-swatches--small .ux-swatch--label{min-width:20px;min-height:20px;padding:2px 8px}.ux-swatches--large .ux-swatch--label{min-width:45px;min-height:45px;padding:0 10px}.ux-swatches--x-large .ux-swatch--label{min-width:70px;min-height:70px;padding:0 15px}.ux-swatches__limiter{font-size:.8rem;cursor:pointer}.ux-swatches-in-loop{width:100%;margin-bottom:.5em}.ux-swatches-in-loop .ux-swatch{margin:4px 8px 4px 0}.ux-swatch-active .box-image .back-image{display:none !important}.has-hover .ux-swatch-active [class*=image-] img,.has-hover:hover .ux-swatch-active [class*=image-] img{-webkit-transform:none;-ms-transform:none;transform:none;-webkit-filter:none;filter:none;opacity:1}.text-center .variations .label,.text-center .ux-swatches{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.text-right .variations .label,.text-right .ux-swatches{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.text-center .ux-swatch:last-child,.text-right .ux-swatch:last-child{margin-right:0}.text-center .ux-swatches-in-loop .ux-swatch,.text-center .ux-swatch+.ux-swatches__limiter{margin-left:4px;margin-right:4px}.ux-swatch-widget-layered-nav-list__graphic{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;max-width:20px;height:20px;margin-right:10px;padding:0}.chosen .ux-swatch-widget-layered-nav-list__graphic:before,.woocommerce-widget-layered-nav-list__item:hover .ux-swatch-widget-layered-nav-list__graphic:before{font-family:"fl-icons";content:"";position:absolute;top:2px;right:0;bottom:0;left:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;font-size:10px}

✏️ Editing: flatsome-swatches-frontend.css

🚀 NebulaPanel