const options = {
slideRadius:"0px", // Radius of the slide corners
paddingY:"0px", // Vertical padding around the container
containerRadius:"0px", // Radius of the container corners
itemsPerPage: 1, // Number of items displayed per page
itemsPerSlide: 1, // Number of items displayed per slide
height: "10rem", // set height of carousel unit (%,rem,px,vh) ,
width: "100%", // set width of carousel unit (%,rem,px) ,
gap: "2px" , // Space between items unit (px)
bgGradientAnimated: false, // Set to true to enable background gradient (only when we have a theme),
applytransparentMaskOnBorder : false, // set border of carousel : blur
theme: "light" // Theme setting, value : "light" | "dark" | "lightAppl"
customTheme: {
primary: "", // Primary color for the theme
secondary: " ", // Secondary color for the theme
third: "" // Tertiary color for the theme
},
drag:true,
pagination: {
enabled: true, // Allow pagination
defaultDotsStyle: true, // Set default style on indicator
position: "outside", // Position of pagination, value: inside | outside | center
wrap: false, // Set wrapper around indicator
specialWrap: { // Add special disposition to wrapper
enabled: false, // Allow special display
left:"0px", // Left position of wrapper, unit (px,%,rem)
top:"0px", // Top position of wrapper, unit (px,%,rem)
justifyContent: "flex-end", // Justify-content display in pagination container
alignItems: "flex-end", // Align-items display in pagination container
orientation: "vertical" // Orientation of pagination, value: vertical | horizontal
},
gap: "0.5rem", // Space between indicators,unit (px)
sizeButton: "0.3rem" // Size of indicator (Height / width),unit (px,%,rem)
}
arrows:{
enabled: true, // Allow arrows
// Set to true to hide arrows when inactive
hideArrowIsInactive: false,
specialDisplay: {
// Indicates whether the special display is enabled or not
enabled: false,
prevButton: {
// Positioning of the previous button relative to the container unit (px,%,rem)
left: "0px", // Offset to the left,
top: "0px", // Offset at the to
},
nextButton: {
// Positioning of the next button relative to the container, unit (px,%,rem)
left:"0px", // Offset to the left,
top:"0px", // Offset at the top,
}
// Defines the spacing between child elements in the main direction
justifyContent: "space-between",
// Aligns child elements along the cross axis
alignItems: "center",
// Defines the spacing between child elements unit(px)
gap: "0.4px",
},
// Indicates whether the main component is enabled or not
enabled: true,
// Defines the position of the main component (here, centered)
position: "center",
// Indicates whether the component should shake or not (visual effect)
shake: false,
// Defines the type of navigation (here, arrow)
type: "arrow" or "chevron"
// Defines the size of the navigation buttons unit (px,%,rem)
sizeButton: "1.8rem",
// Defines the radius of the navigation arrows (rounded) unit (px,%,rem)
arrowRadius:"20px",
}
}