Button-Card

type: custom:stack-in-card
cards:
  - type: custom:mushroom-template-card
    icon: mdi:fan
    primary: Control Wurden Fan
  - type: grid
    square: false
    columns: 5
    cards:
      - type: custom:button-card
        entity: script.wurden_fan_on_off
        name: On/Off
        show_name: null
        icon: mdi:fan
        tap_action:
          action: toggle
        styles:
          grid:
            - grid-template-areas: "\"i\" \"n\""
            - grid-template-columns: 1fr;
            - grid-template-rows: 1fr;
          card:
            - margin: 0
            - border-radius: 20px
            - padding: 12px 14px 12px 14px
          img_cell:
            - background: "#272829"
            - border-radius: 100px
            - width: 50px
            - height: 30px
          icon:
            - justify-self: start
            - width: 20px
            - color: white
          name:
            - padding-top: 8px
            - justify-self: middle
            - font-size: 12px
            - font-weight: 500
      - type: custom:button-card
        entity: script.wurden_fan_speed_mode
        name: Speed
        show_name: true
        icon: mdi:fan-plus
        tap_action:
          action: toggle
        styles:
          grid:
            - grid-template-areas: "\"i\" \"n\""
            - grid-template-columns: 1fr;
            - grid-template-rows: 1fr;
          card:
            - margin: 0
            - border-radius: 20px
            - padding: 12px 14px 12px 14px
          img_cell:
            - background: "#272829"
            - border-radius: 100px
            - width: 50px
            - height: 30px
          icon:
            - justify-self: start
            - width: 20px
            - color: white
          name:
            - padding-top: 8px
            - justify-self: middle
            - font-size: 12px
            - font-weight: 500
      - type: custom:button-card
        entity: script.wurden_fan_timer
        name: Timer
        show_name: true
        icon: mdi:fan-clock
        tap_action:
          action: toggle
        styles:
          grid:
            - grid-template-areas: "\"i\" \"n\""
            - grid-template-columns: 1fr;
            - grid-template-rows: 1fr;
          card:
            - margin: 0
            - border-radius: 20px
            - padding: 12px 14px 12px 14px
          img_cell:
            - background: "#272829"
            - border-radius: 100px
            - width: 50px
            - height: 30px
          icon:
            - justify-self: start
            - width: 20px
            - color: white
          name:
            - padding-top: 8px
            - justify-self: middle
            - font-size: 12px
            - font-weight: 500
      - type: custom:button-card
        entity: script.wurden_fan_vertical_mode
        name: Vertical
        show_name: true
        icon: mdi:fan-chevron-up
        tap_action:
          action: toggle
        styles:
          grid:
            - grid-template-areas: "\"i\" \"n\""
            - grid-template-columns: 1fr;
            - grid-template-rows: 1fr;
          card:
            - margin: 0
            - border-radius: 20px
            - padding: 12px 14px 12px 14px
          img_cell:
            - background: "#272829"
            - border-radius: 100px
            - width: 50px
            - height: 30px
          icon:
            - justify-self: start
            - width: 20px
            - color: white
          name:
            - padding-top: 8px
            - justify-self: middle
            - font-size: 12px
            - font-weight: 500
      - type: custom:button-card
        entity: script.wurden_fan_horizontal_mode
        name: Horizontal
        show_name: true
        icon: mdi:fan-minus
        tap_action:
          action: toggle
        styles:
          grid:
            - grid-template-areas: "\"i\" \"n\""
            - grid-template-columns: 1fr;
            - grid-template-rows: 1fr;
          card:
            - margin: 0
            - border-radius: 20px
            - padding: 12px 14px 12px 14px
          img_cell:
            - background: "#272829"
            - border-radius: 100px
            - width: 50px
            - height: 30px
          icon:
            - justify-self: start
            - width: 20px
            - color: white
          name:
            - padding-top: 8px
            - justify-self: middle
            - font-size: 12px
            - font-weight: 500