export default [
    {
        name: '<code>$carousel-min-height</code>',
        description: 'The carousel default height before image loaded',
        default: '<code>120px</code>'
    },
    {
        name: '<code>$carousel-arrow-background</code>',
        description: 'The carousel arrow background',
        default: '<code>$scheme-main</code>'
    },
    {
        name: '<code>$carousel-arrow-color</code>',
        description: 'The carousel color border',
        default: '<code>$primary</code>'
    },
    {
        name: '<code>$carousel-arrow-icon-spaced</code>',
        description: 'The carousel arrow icon spaced left and right',
        default: '<code>1.5rem</code>'
    },
    {
        name: '<code>$carousel-arrow-top</code>',
        description: 'The carousel position by top',
        default: '<code>50%</code>'
    },
    {
        name: '<code>$carousel-indicator-background</code>',
        description: 'The carousel indicator background',
        default: '<code>rgba($scheme-invert, 0.45)</code>'
    },
    {
        name: '<code>$carousel-indicator-color</code>',
        description: 'The carousel indicator color',
        default: '<code>$scheme-main</code>'
    },
    {
        name: '<code>$carousel-indicator-border</code>',
        description: 'The carousel indicator color border',
        default: '<code>$primary</code>'
    },
    {
        name: '<code>$carousel-indicator-color</code>',
        description: 'The carousel indicator background',
        default: '<code>$white</code>'
    },
    {
        name: '<code>$carousel-indicator-spaced</code>',
        description: 'The carousel indicator spaced',
        default: '<code>.5rem</code>'
    },
    {
        name: '<code>$carousel-overlay-background</code>',
        description: 'The carousel background when overlay',
        default: '<code>rgba($scheme-invert, 0.86)</code>'
    },
    {
        name: '<code>$carousel-overlay-z</code>',
        description: 'The carousel z-index for overlay',
        default: '<code>40</code>'
    }
]

export default [
    {
        name: '<code>$carousel-min-height</code>',
        description: 'The carousel default height before image loaded',
        default: '<code>120px</code>'
    },
    {
        name: '<code>$carousel-arrow-background</code>',
        description: 'The carousel arrow background',
        default: '<code>$scheme-main</code>'
    },
    {
        name: '<code>$carousel-arrow-color</code>',
        description: 'The carousel color border',
        default: '<code>$primary</code>'
    },
    {
        name: '<code>$carousel-arrow-icon-spaced</code>',
        description: 'The carousel arrow icon spaced left and right',
        default: '<code>1.5rem</code>'
    },
    {
        name: '<code>$carousel-arrow-top</code>',
        description: 'The carousel position by top',
        default: '<code>50%</code>'
    },
    {
        name: '<code>$carousel-indicator-background</code>',
        description: 'The carousel indicator background',
        default: '<code>rgba($scheme-invert, 0.45)</code>'
    },
    {
        name: '<code>$carousel-indicator-border</code>',
        description: 'The carousel indicator color border',
        default: '<code>$scheme-main</code>'
    },
    {
        name: '<code>$carousel-indicator-color</code>',
        description: 'The carousel indicator color',
        default: '<code>$primary</code>'
    },
    {
        name: '<code>$carousel-indicator-spaced</code>',
        description: 'The carousel indicator spaced',
        default: '<code>.5rem</code>'
    },
    {
        name: '<code>$carousel-overlay-background</code>',
        description: 'The carousel background when overlay',
        default: '<code>rgba($scheme-invert, 0.86)</code>'
    },
    {
        name: '<code>$carousel-overlay-z</code>',
        description: 'The carousel z-index for overlay',
        default: '<code>40</code>'
    }
]

change variable list in docs to match the variables and values in `src/scss/components/_carousel.scss` (#3070)