@kanton-basel-stadt/designsystem
Version:
Unplugin to install the digital design system of the canton of Basel-Stadt
35 lines (27 loc) • 780 B
CSS
@tailwind components;
@layer components {
.slider-track-wrapper {
@apply w-full bg-gray-200 h-[16px] rounded-[8px] px-10 my-20;
}
.slider-track {
@apply relative;
}
.slider-fill {
@apply bg-blue-600 h-[16px] rounded-l-[8px] relative -translate-x-10;
}
.slider-handle {
@apply w-[26px] h-[26px] rounded-full border border-gray-600 bg-white absolute -top-5 -translate-x-[13px];
}
.slider-marks-container {
@apply absolute top-0 pointer-events-none w-full;
}
.slider-mark {
&:before {
@apply w-[6px] h-[6px] bg-gray-900 content-[''] block rounded-full mt-5 mb-10;
}
&[data-active='true']:before {
@apply bg-white;
}
@apply absolute -translate-x-[50%] text-[8px] top-0 flex flex-col items-center;
}
}