diff --git a/thaw/src/slider/mod.rs b/thaw/src/slider/mod.rs index 2d6d80e..3b1d7df 100644 --- a/thaw/src/slider/mod.rs +++ b/thaw/src/slider/mod.rs @@ -37,7 +37,6 @@ pub fn Slider( let (id, name) = FieldInjection::use_id_and_name(id, name); let validate = Rule::validate(rules, value, name); let is_chldren = children.is_some(); - let list_id = is_chldren.then(|| uuid::Uuid::new_v4().to_string()); let current_value = Memo::new(move |_| { let max = max.get(); let min = min.get(); @@ -100,14 +99,13 @@ pub fn Slider( on:input=on_input value=current_value.get_untracked() prop:value=move || current_value.get() - list=list_id.clone() />
- +
{children()} - +
diff --git a/thaw/src/slider/slider.css b/thaw/src/slider/slider.css index afa6a74..69e2503 100644 --- a/thaw/src/slider/slider.css +++ b/thaw/src/slider/slider.css @@ -33,6 +33,19 @@ outline-style: none; } +.thaw-slider:focus-within::after { + content: ""; + position: absolute; + bottom: calc(0px); + left: calc(-10px); + right: calc(-10px); + top: calc(0px); + z-index: 1; + pointer-events: none; + border-radius: var(--borderRadiusMedium); + border: 2px solid var(--colorStrokeFocus2); +} + .thaw-slider__input { grid-column-end: -1; grid-column-start: 1; diff --git a/thaw/src/slider/slider_label.rs b/thaw/src/slider/slider_label.rs index 248b149..6eb7c0f 100644 --- a/thaw/src/slider/slider_label.rs +++ b/thaw/src/slider/slider_label.rs @@ -20,9 +20,9 @@ pub fn SliderLabel( }; view! { -