VerticalTextSwitch

Switching sides vertically and with text.

Example

false

Props

    🕹ī¸ standard props
    value
    boolean
    The value of the switch (true or false)
    false
    height
    size
    Height of the switch
    100%
    width
    size
    Width of the switch
    100%
    backgroundColor
    color
    Background color of the switch
    undefined
    firstColor
    color
    Color for the first option
    undefined
    secondColor
    color
    Color for the second option
    firstColor
    fontSize
    size
    Font size for the options
    12px
    hoverBackgroundColor
    color
    Background color on hover
    undefined
    hoverBoxShadow
    string
    Box shadow effect on hover
    undefined
    animationDuration
    number
    Duration of the animation in milliseconds
    200
    falseOptionSnippet
    Snippet
    Snippet for the false option
    undefined
    trueOptionSnippet
    Snippet
    Snippet for the true option
    undefined
    🎨 style props
    --vertical-text-switch-height
    size
    Height of the vertical text switch
    100%
    --vertical-text-switch-hover-background-color
    color
    Background color on hover
    undefined
    --vertical-text-switch-hover-box-shadow
    string
    Box shadow effect on hover
    undefined

Slots

    falseOptionSnippet
    Snippet for the false option
    trueOptionSnippet
    Snippet for the true option

Events

    onchange
    Event triggered when the value of the switch changes