xt/color-q
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整ColorPicker的Range输入组件的默认样式。

Browse Source
This commit is contained in:
徐涛
2024-12-31 09:19:58 +08:00
parent 4b50cbbeaa
commit 370e36393c
1 changed files with 38 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/component.css
View File

@@ -347,4 +347,42 @@
} }
} }
} }
/* 颜色选择器滑杆 */
input[type='range'].picker {
-webkit-appearance: none;
width: 100%;
height: 1em;
background: transparent;
&::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 1em;
height: 1em;
background: oklch(from var(--color-primary) l c h / 70%);
border-radius: var(--border-radius-xxs);
cursor: pointer;
}
&::-moz-range-thumb {
width: 1em;
height: 1em;
background: oklch(from var(--color-primary) l c h / 70%);
border-radius: var(--border-radius-xxs);
cursor: pointer;
}
&::-webkit-slider-runnable-track {
width: 100%;
height: 1em;
cursor: pointer;
background: transparent;
border-radius: var(--border-radius-xxs);
}
&::-moz-range-track {
width: 100%;
height: 1em;
cursor: pointer;
background: transparent;
border-radius: var(--border-radius-xxs);
}
}
} }