Update documentation to add alignment option for custom elements

[akcasoy]

[REQUIRED] Card diagnostic information:

card_version: 6.0.0-beta.8
browser: >-
  Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML,
  like Gecko) Version/17.5 Safari/605.1.15
date: 2024-10-24T09:57:07.753Z
frigate_versions:
  01JAW7F0SF7AAWAFYP4K7Z7Z80: 5.4.0/0.14.1-f4f3cfa
lang: de
timezone: Europe/Berlin
git:
  hash: a869109
  build_date: Mon, 14 Oct 2024 00:01:23 GMT
  commit_date: Sun, 13 Oct 2024 16:50:47 -0700
ha_version: 2024.10.1
config:
  type: custom:frigate-card
  cameras:
    - camera_entity: camera.doorbell
      live_provider: go2rtc
      go2rtc:
        stream: doorbell_stream_fuer_mode_mse
        modes:
          - mse
    - camera_entity: camera.defne_cam
      live_provider: go2rtc
      go2rtc:
        stream: e1_zoom_stream_fuer_mode_mse
        modes:
          - mse
  menu:
    buttons:
      camera_ui:
        enabled: false
      cameras:
        enabled: false
      snapshots:
        enabled: false
      timeline:
        enabled: false
      frigate:
        enabled: true
      download:
        enabled: false
      media_player:
        enabled: false
      display_mode:
        enabled: false
      mute:
        enabled: true
        alignment: opposing
    style: outside
    position: bottom
    button_size: 50
  live:
    controls:
      next_previous:
        style: chevrons
      builtin: false
      thumbnails:
        mode: none
    preload: true
    lazy_load: false
    draggable: true
    transition_effect: slide
  dimensions: {}
  status_bar:
    style: none
  media_gallery:
    controls:
      thumbnails:
        size: 140
        show_favorite_control: false
        show_timeline_control: false
        show_download_control: false
      filter:
        mode: none
  performance:
    profile: high
  automations:
    - conditions:
        - condition: camera
          cameras:
            - camera.doorbell
      actions:
        - action: custom:frigate-card-action
          frigate_card_action: unmute
      actions_not:
        - action: custom:frigate-card-action
          frigate_card_action: mute
  elements:
    - type: custom:frigate-card-menu-icon
      icon: mdi:arrow-collapse
      tap_action:
        action: custom:frigate-card-action
        frigate_card_action: ptz_digital
    - type: custom:frigate-card-conditional
      conditions:
        - condition: camera
          cameras:
            - camera.doorbell
      elements:
        - type: custom:frigate-card-menu-state-icon
          icon: mdi:ceiling-light
          priority: 1
          entity: light.hue_white_lamp_kinderzimmer
          tap_action:
            action: toggle
        - type: custom:frigate-card-menu-state-icon
          icon: mdi:track-light
          entity: switch.e1_zoom_infrarotlicht_im_nachtmodus
          tap_action:
            action: toggle

[REQUIRED] Description of problem:

Stock menu buttons have an alignment option like this (opposing put that button to the right side of the menu):

 menu:
    buttons:
      mute:
        alignment: opposing

I would like to also put some of my custom elements there (type: custom:frigate-card-menu-state-icon). As far as i can see, they just have a priority option which shift them inside the current menu position.

[dermotduffy]

Quick answer: Actually, I think the code might already support this but the docs don't show it. Did you try:

[...]
elements:
  - type: custom:frigate-card-menu-state-icon
    icon: mdi:track-light
    entity: switch.e1_zoom_infrarotlicht_im_nachtmodus
    alignment: opposing              <-------------------- Added
    tap_action:
      action: toggle

If this works for you we can keep this issue around to update the docs.

[akcasoy]

It works thank you!
I can also combine alignment: opposing with priority. Super!