splide icon indicating copy to clipboard operation
splide copied to clipboard

fixedWidth breakpoints not working

Open fengnan1002 opened this issue 1 year ago • 1 comments
trafficstars

Checks

  • [X] Not a duplicate.
  • [X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

4.1.4

Description

I want to have 83% fixedWidth for mobile only. So I added 100% fixedWidth through breakpoints but still 83% of width and mobile padding is keep applying.

Reproduction Link

No response

Steps to Reproduce

image

{
    "drag": true,
    "flickPower": 200,
    "flickMaxPages": 1,
    "mediaQuery": "min",
    "speed": 300,
    "start": 1,
    "type": "loop",
    "fixedWidth": "83%",
    "gap": "var(--spacing-xs)",
    "padding": {
        "left": "var(--layout-margin)",
        "right": "var(--layout-margin)"
    },
    "arrows": false,
    "destroy": false,
    "pagination": true,
    "breakpoints": {
        "1024": {
            "fixedWidth": '100%',
            "gap": 0,
            "padding": 0,
            "perMove": 1,
            "perPage": 1,
            "arrows": true,
            "destroy": false,
            "pagination": true
        }
    }
}

Expected Behaviour

Is it possible to updated fixedWidth on desktop using breakpoints?

fengnan1002 avatar May 12 '24 21:05 fengnan1002

Using breakpoints without mediaQuery: 'min', use max-width for the breakpoints. So add mediaQuery: 'min', and then add your breakpoints and I believe it should work.

squidiw avatar Jul 26 '24 21:07 squidiw