mirror of
https://github.com/barsdeveloper/ueblueprint.git
synced 2026-02-28 03:24:43 +08:00
Color picker improvements
This commit is contained in:
39
dist/css/ueb-style.css
vendored
39
dist/css/ueb-style.css
vendored
@@ -676,13 +676,46 @@ ueb-color-handler {
|
||||
|
||||
.ueb-color-picker-saturation,
|
||||
.ueb-color-picker-value {
|
||||
margin: 0 8px;
|
||||
margin: 0 6px;
|
||||
width: 30px;
|
||||
background: linear-gradient(to bottom, transparent 10%, #000000 100%), rebeccapurple;
|
||||
background-color: rgb(calc(var(--ueb-color-r) * 255), calc(var(--ueb-color-g) * 255), calc(var(--ueb-color-b) * 255));
|
||||
}
|
||||
|
||||
.ueb-color-picker-saturation {
|
||||
background-image: linear-gradient(to bottom, transparent 10px, #FFFFFF 100%);
|
||||
}
|
||||
|
||||
.ueb-color-picker-value {
|
||||
background: linear-gradient(to bottom, transparent 10%, #FFFFFF 100%), rebeccapurple;
|
||||
background-image: linear-gradient(to bottom, transparent 10px, #000000 100%);
|
||||
}
|
||||
|
||||
.ueb-color-picker-slider {
|
||||
position: relative;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.ueb-color-picker-slider::before, .ueb-color-picker-slider::after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 5px solid transparent;
|
||||
}
|
||||
.ueb-color-picker-slider::before {
|
||||
left: -4px;
|
||||
border-left-color: #e0e0e0;
|
||||
}
|
||||
.ueb-color-picker-slider::after {
|
||||
right: -4px;
|
||||
border-right-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.ueb-color-picker-saturation .ueb-color-picker-slider {
|
||||
top: calc(100% - var(--ueb-color-s) * 100%);
|
||||
}
|
||||
|
||||
.ueb-color-picker-value .ueb-color-picker-slider {
|
||||
top: calc(100% - var(--ueb-color-v) * 100%);
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=ueb-style.css.map */
|
||||
|
||||
Reference in New Issue
Block a user