logo

Arrows

const options = {

  // Indicates whether the main component is enabled or not
  enabled: true,

  specialDisplay: {
    // Indicates whether the special display is enabled or not
    enabled: false,
  
    // Defines the spacing between child elements in the main direction (same value like with css)
    justifyContent: "space-between",
  
    // Aligns child elements along the cross axis (same value like with css)
    alignItems: "center",
  
    // Defines the spacing between child elements, unit (px)
    gap: "3px",
  
    prevButton: {
      // Positioning of the previous button relative to the container, unit (px,%,rem)
      left: "0px", // Offset to the left
      top:"0px",  // Offset at the top
    },
  
    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 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" | "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",

}