conversionxl / aybolit

Lightweight web components library built with LitElement.
https://conversionxl.github.io/aybolit/
MIT License
7 stars 8 forks source link

fix(cxl-ui): cxl-tabs-slider - improve usability of scroller buttons #366

Closed freudFlintstone closed 7 months ago

freudFlintstone commented 7 months ago

https://app.clickup.com/t/86ayt61gb

Slider buttons are positioned overlapping cards on each end of the the slider, which makes users inadvertently click the card below the button when they reach the end of the list.

Adding padding would make the cards indented too far in, hurting the dashboard design. Moving the buttons slightly outward fixes the UX issue without disrupting the visual aspect significantly.

github-actions[bot] commented 7 months ago

size-limit report 📦

Path Size
packages/cxl-ui/pkg/dist-web/cxl-ui.js 66.97 KB (+0.06% 🔺)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js 11.87 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js 28.13 KB (+0.13% 🔺)
packages/cxl-ui/pkg/dist-web/vendor.js 135.58 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js, packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js, packages/cxl-ui/pkg/dist-web/cxl-ui.js, packages/cxl-ui/pkg/dist-web/manifest.js, packages/cxl-ui/pkg/dist-web/unresolved.js, packages/cxl-ui/pkg/dist-web/vendor.js 243.7 KB (+0.03% 🔺)
freudFlintstone commented 7 months ago

Task linked: CU-86ayt61gb Dashboard sliders - horizontal scroll and last click