dynamicweb / swiffy-slider

Super fast carousel and slider with touch for optimized websites running in modern browsers.
MIT License
238 stars 29 forks source link

Scrollbar changed layout? #93

Open Jonas-Djois opened 1 month ago

Jonas-Djois commented 1 month ago

Describe the bug The scrollbar on slider has changed design/layout from a nice modern with rounded corners at the ends, to look very old-school and very Windows 98-ish with two small arrows at each end and a bad looking bar.

To Reproduce ](https://swiffyslider.com/configuration/?slider-nav-style=slider-nav-round&slider-nav-arrows=slider-nav-outside&slider-nav-scrollbar=slider-nav-scrollbar&preview-style=preview-images)

Expected behavior I expect nice round corners in both ends as before, 1 2

Screenshots Attached

nicped commented 1 month ago

This is due to an update of styling of scrollbars in Google Chrome 121. It has started to support the CSS specifications for scrollbars which is also part of Swiffy Slider.

This can be adjusted to fit with their new approach, but requires some refactoring of the CSS. Will work this into the next version.

Jonas-Djois commented 1 month ago

Thanks for the explanation. We will look forward to it being resolved in the next version, as we use them a lot on several of our websites, and the "old look" with arrows doesn't look super good and do not match our overall design.

When do you expect the next version to be ready for launch, just so we have a sense of the timeline?

Jonas-Djois commented 4 weeks ago

Thanks for the explanation. We will look forward to it being resolved in the next version, as we use them a lot on several of our websites, and the "old look" with arrows doesn't look super good and do not match our overall design.

When do you expect the next version to be ready for launch, just so we have a sense of the timeline?

nicped commented 4 weeks ago

It's open source, so it is night time. There is a lot of changes that needs to go out with next release that needs testing and docs first. There is no dead-line.

You can fix the rendering issue by inserting this snippet after swiffy-slider.css

<style>
        .slider-container {
    scrollbar-width: inherit!important;
    scrollbar-color: inherit!important;
}
.slider-nav-scrollbar .slider-container {
    scrollbar-width: inherit!important;
}
    </style>
Jonas-Djois commented 1 week ago

Hello, I tried to paste in the code in this file: swiffy-slider.min.css

It just made the scrollbar even bigger. But still the same old "WIN-98"-ish look. Not the modern smooth look. See screenshot of before and after.

IS the code right, or do I paste it incorrect?

Scrollbar after new css code - bigger Scrollbar original - small Swiffy slider code