Buttons for dashboard menu

buttons_dashboard_menu.yaml

type: horizontal-stack
cards:
    - type: custom:button-card
      template: button_dashboard_menu
      variables:
         path: home
         board: ui-overzicht
#              view: >
#                [[[ return window.location.pathname.split('/')[2]; ]]]
#              dash: >
#                [[[ return window.location.pathname.split('/')[1]; ]]]
      tooltip: Overzicht
      icon: >
        [[[ return (states['sensor.alerts_notifying'].state > 0)
                  ? 'mdi:home-alert': 'mdi:home'; ]]]
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-overzicht'; ]]]
      styles:
#             card:
#               - background: >
#                   [[[ return variables.dash === variables.board ? 'var(--primary-color)' : 'none'; ]]]
        icon:
          - color: >
              [[[ return (states['sensor.alerts_notifying'].state > 0)
                  ? 'var(--alert-color)': 'green'; ]]]
#             - size: >
#                 [[[ return variables.view === variables.path
#                     ? '10px' : '24px'; ]]]
#         state:
#           - operator: template
#             value: >
#               [[[ return (states['sensor.alerts_notifying'].state > 0); ]]]
#             spin: true

    - type: custom:button-card
      template: button_dashboard_menu
      variables:
        path: energy
        board: ui-data
      tooltip: Huis info
      icon: mdi:home-analytics
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-data'; ]]]
      styles:
        icon:
          - color: >
              [[[ return (states['sensor.netto_verbruik'].state < 0)
                  ? 'gold': 'brown'; ]]]
# var(--icon-color-off)

    - type: custom:button-card
      template: button_dashboard_menu
      variables:
        path: familie
        board: ui-familie
      tooltip: Familie
      icon: mdi:home-account
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-familie'; ]]]
      styles:
        icon:
          - color: >
              [[[ return states['sensor.family_home'] &&
                         states['sensor.family_home'].attributes.icon_color ?
                  states['sensor.family_home'].attributes.icon_color : 'black'; ]]]

    - type: custom:button-card
      template: button_dashboard_menu
      variables:
        path: instellingen
        board: ui-instellingen
      tooltip: Instellingen
      icon: cli:home-cog #mdi:store-cog
      styles:
        icon:
          - color: >
              [[[ return (states['input_boolean.ventilate'].state === 'on') ? 'var(--alert-color)'
               : (states['switch.vijverpompen'].state === 'on') ? 'lightseagreen'
               : 'var(--icon-color-off'; ]]]
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-instellingen'; ]]]

    - type: custom:button-card
      template: button_dashboard_menu
      variables:
        path: Systeem info
        board: ui-develop
      tooltip: Systeem
      icon: mdi:home-assistant
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-develop'; ]]]

    - type: custom:button-card
      template: button_dashboard_menu
      variables:
        path: cameras
        board: ui-cctv
      tooltip: Cameras
      icon: cli:home-video-outline #mdi:cctv
      tap_action:
        action: navigate
        navigation_path: >
          [[[ return variables.view === variables.path
              ? none : '/ui-cctv'; ]]]
#       styles:
#         icon:
#           - color: >
#               [[[ return (states['switch.poe_inside_cameras'].state === 'on')
#                   ? 'var(--active-color)' : 'var(--icon-color-off'; ]]]