uid: Dimmer
tags: []
props:
  parameters:
    - context: item
      description: An item to control
      label: Item
      name: dimmeritem
      required: false
      type: TEXT
timestamp: Dec 28, 2020, 3:26:21 PM
component: f7-card
config:
  noShadow: false
  class:
    - padding
  style:
    border-radius: 10px
    overflow: hidden
    -ms-user-select: none
    -moz-user-select: none
    -webkit-user-select: none
    user-select: none
    --weather-card-color: 255,255,255
    --card-text-color: black
slots:
  default:
    - component: f7-row
      slots:
        default:
          - component: f7-col
            slots:
              default:
                - component: Label
                  config:
                    text: '=(props.dimmeritem) ? props.dimmeritem : "Set dimmer"'
                    style:
                      color: var(--card-text-color)
                      font-size: 20px
                      line-height: 20px
                      white-space: nowrap
                      overflow: hidden
                      text-overflow: ellipsis
          - component: f7-col
            config:
              style:
                z-index: 999
                text-align: rigt
                width: fit-content
                overflow: hidden
            slots:
              default:
                - component: oh-toggle
                  config:
                    color: blue
                    item: =props.dimmeritem
    - component: f7-row
      slots:
        default:
          - component: f7-col
            slots:
              default:
                - component: Label
                  config:
                    text: =items[props.dimmeritem].displayState || items[props.dimmeritem].state
                    style:
                      color: var(--card-text-color)
                      font-size: 12px
                      line-height: 20px
                      white-space: nowrap
                      overflow: hidden
                      text-overflow: ellipsis
    - component: f7-row
      config:
        class:
          - justify-content-space-around
          - display-flex
          - align-items-center
          - align-content-stretch
      slots:
        default:
          - component: f7-card
            config:
              noShadow: true
              class: margin display-flex align-items-center
              style:
                fontSize: 10px
                min-width: calc(100% - 15px)
            slots:
              default:
                - component: oh-slider
                  config:
                    label: true
                    color: yellow
                    min: 0
                    item: =props.dimmeritem