File manager - Edit - /home/c14075/dragmet-ural.ru/www/bitrix/js/landing/ui/field/color/src/control/opacity/css/opacity.css
Back
.landing-ui-field-color-opacity { background: url('images/opacity.png') left top repeat; background-size: 8px; position: relative; width: 100%; height: 40px; margin-top: 4px; margin-bottom: 10px; border-radius: 2px; } /*opacity border not work with gradient - need hack*/ .landing-ui-field-color-opacity::before { content: ''; display: block; position: absolute; top: -1px; bottom: -1px; left: -1px; right: -1px; box-shadow: 0 0 4px rgba(128, 128, 128, .1); border: 1px solid rgba(0, 0, 0, .05); } /*to can click on picker circle*/ .landing-ui-field-color-opacity::after { content: ''; height: 10px; display: block; } .landing-ui-field-color-opacity-color { width: 100%; height: 100%; border-radius: 2px; } .landing-ui-field-color-opacity-picker { position: absolute; width: 4px; top: -2px; margin-left: -2px; bottom: -2px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 2px; background-color: rgba(82, 92, 105, .22); cursor: pointer; } .landing-ui-field-color-opacity-picker-item { position: absolute; display: flex; justify-content: center; align-items: center; left: -8px; bottom: -7px; width: 18px; height: 18px; border-radius: 50%; background-color: #fff; box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .19); } .landing-ui-field-color-opacity-picker-item-circle { width: 8px; height: 8px; border-radius: 50%; background-color: #2fc6f6; } .landing-ui-field-color-draggable { user-select: none; } .landing-ui-field-color-draggable .landing-ui-field-color-opacity { cursor: pointer; } .landing-ui-field-color-draggable .landing-ui-field-color-opacity-picker { pointer-events: none; } .landing-ui-field-color-opacity-container { display: flex; } .landing-ui-field-color-opacity-container .landing-ui-field-range-output { align-items: center; } .landing-ui-field-color-opacity-range-output { display: flex; width: 89px; padding-left: 10px; } .landing-ui-field-color-opacity-range-output-input { font-family: var(--ui-font-family-primary, var(--ui-font-family-helvetica)); font-size: 15px; text-align: center; color: #000000; width: 49px; height: 39px; line-height: 37px; margin-right: 13px; box-sizing: border-box; border-bottom: 1px rgba(198, 205, 211, .4) solid; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .landing-ui-field-color-opacity-range-output-arrows { display: flex; flex-direction: column; width: 27px; height: 39px; border-radius: 2px; border: 1px #C6CDD3 solid; } .landing-ui-field-color-opacity-range-output-arrows-up, .landing-ui-field-color-opacity-range-output-arrows-down { position: relative; height: 49%; box-sizing: border-box; cursor: pointer; transition: all 200ms ease; } .landing-ui-field-color-opacity-range-output-arrows-up:hover { box-shadow: 0 -1px 5px 0 rgba(0,0,0,0.35); } .landing-ui-field-color-opacity-range-output-arrows-up:active { box-shadow: 0 -1px 1px 0 rgba(0,0,0,0.35); } .landing-ui-field-color-opacity-range-output-arrows-down:hover { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.35); } .landing-ui-field-color-opacity-range-output-arrows-down:active { box-shadow: 0 2px 1px 0 rgba(0,0,0,0.35); } .landing-ui-field-color-opacity-range-output-arrows-up::before, .landing-ui-field-color-opacity-range-output-arrows-down::before { position: absolute; content: ''; width: 8px; height: 8px; left: 50%; top: 56%; transform: translate3d(-50%, -50%, 0) rotate(-45deg); transform-origin: center center; border-top: 2px #535C69 solid; border-right: 2px #535C69 solid; opacity: .8; transition: opacity 200ms ease; pointer-events: none; } .landing-ui-field-color-opacity-range-output-arrows-down { border-top: 1px #C6CDD3 solid; height: 50%; } .landing-ui-field-color-opacity-range-output-arrows-down::before { transform: translate3d(-50%, -50%, 0) rotate(135deg); top: 47%; } .landing-ui-field-color-opacity-range-output-arrows-up:hover::before, .landing-ui-field-color-opacity-range-output-arrows-down:hover::before { opacity: 1; }
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0.25 |
proxy
|
phpinfo
|
Settings