feat: toggle refinement styling #6596
Conversation
thomasbritton
commented
Feb 28, 2025
thomasbritton
commented
(cherry picked from commit 11709a6)
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 7a24815:
|
| font-size: 0.875rem; | ||
| line-height: 1.75rem; |
There was a problem hiding this comment.
Any reason to add this? I think we don't need to be opinionated here.
| .ais-ToggleRefinement-label { | ||
| font-size: 0.875rem; | ||
| line-height: 1.75rem; | ||
| display: block; |
There was a problem hiding this comment.
| display: block; |
This is overridden in l. 9.
| display: flex; | ||
| } | ||
|
|
||
| input[class^='ais-'][class*='ToggleRefinement-checkbox'] { |
There was a problem hiding this comment.
I'm not sure why we need such selector, why not target .ais-ToggleRefinement-checkbox?
There was a problem hiding this comment.
This is because there is a selector in common.css that is of higher specificity input[class^='ais-'][type='checkbox']:checked { /* ... */ }
I did it this way because we were out of time so just needed something quick that would work but the class above probably needs to be merged into the refinement-list.css
