Open
Conversation
Mouse or touch event can now continue outside of card bounds to continue adjusting the slider by relative position change. This is incredibly helpful on small mobile displays.
…ement inherited abstract member" error
Collaborator
Author
|
curious the checks failed because this branch builds and runs just fine 🤔 |
Member
|
It looks like it wants some linting changes: https://github.com/custom-cards/slider-button-card/runs/6714563334?check_suite_focus=true |
Collaborator
Author
|
Alright, those are cleared up |
simbaja
added a commit
to simbaja/ha-slider-button-card
that referenced
this pull request
Feb 23, 2026
simbaja
added a commit
to simbaja/ha-slider-button-card
that referenced
this pull request
Feb 24, 2026
* update lit to 3.2.0 and modernize all dependencies to latest versions * cleanup * add support for custom styles config injection * enabled a card min-height config option * changed version * added humidifier support * cleaned up the readme * separated out the unit of measure from the state * implemented relative slider positioning (custom-cards#5) * fixed slider clamping * maybe fixed unstyled content issue * enabled ripple effects
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Previously, slider value was based on your absolute finger or mouse position within the bounds of the slider track. This resulted in a light at 10% suddenly shooting up to 90% because that's where your finger or mouse touched the slider and moved. Two changes are made in this PR:
The slider now changes value based on the relative movement your mouse or finger moves. e.g If the light is at 10% and you touch the slider at 70%, then drag up to 80%, that is a difference of +10% and thus the light now gets set to 20%. This feels much more natural and operates more like the Google Home app interface (which uses cards very much like slider-button-card).
Because of this, sometimes the slider needs to move even when your finger is no longer inside the bounds of the slider itself. This has been fixed. If the light is at 10%, and you grab the slider at 90% and move your finger beyond the right edge of the slider, the slider keeps moving in tune with your finger's travel distance. This also works off the left edge, as well as the top and bottom edges for vertical sliders.
All of this makes managing the slider much easier on small mobile or wall mounted screens, and when the desired values are right at the screen edge. I've also found it makes the web experience just that much nicer too.
This has been tested on mobile android app as well as the web version. With vertical and horizontal sliders. With all slider card types.