Hard time creating a table in Markdown

Configuration Frontend
1

trying to create a card with the aliases setup for Google/Cloud, I am having a hard time showing it nicely in the frontend.

HAd a look at the Markdown cheat code, but tbh, that doesnt really help a lot…
Maybe this is not the right card to do so, but until anyone has a better idea, please would you have a look how I can do better. The efforts for the table are above, below are several others I still need to order and style.

here is a glimpse of what I have now:

54

which looks utterly inadequate, but every time I change a space or a new line, the whole card changes… Html markdown certainly has its own laws of mystery (for me)

type: vertical-stack
cards:
  - type: horizontal-stack
    cards:

      - type: custom:button-card
        template: horizontal-filler

      - type: markdown
        title: >
          Home-assistant Aliases
        style: |
          ha-card { background: 'var(--paper-card-background-color)'; }
        content: |
          ___
          **Switches:**

          | Master bed         | Subwoofer     | Audio setup          |
          |--------------------|:-------------:|:--------------------:|
          |   - Nightlight     |   - Rumble    | - Geluidsapparatuur  |
          |  -  Nachtlamp      |               |                      |
          |                    |               |                      |

          | Audio system       | Early night   | Wakeup radio         |
          |--------------------|:-------------:|:--------------------:|
          |  - Muziek          | - Vroegertje  | - Wakker             |
          |  - Music           |               | - Ellende            |
          |                    |               | - Lawaai             |
          |                    |               | - Stoorzender        |

          | Audio Gym          | Boiler        | Dorm                 |
          |--------------------|:-------------:|:--------------------:|
          |  - Gym audio       | - Boiler      | - Louise             |
          |                    |               | - Dorm               |

          | Espresso           | Kantoor       | Master bedroom switch|
          |--------------------|:-------------:|:--------------------:|
          |  - Koffie          | - Home office | - Oplader            |

          | Netwerk auditorium | Netwerk Dorm  | Netwerk Library      |
          |--------------------|:-------------:|:--------------------:|
          |  Network Auditorium| - Network Dorm|- Network library     |
          |- Network Living    |               |                      |

          | Quooker            | Tv auditorium | Tv hobbykamer        |
          |--------------------|:-------------:|:--------------------:|
          | - Kokend water     | - Televisie   |  - TV library        |

          | Dishes             | Wasdroger     | Wasmachine           |
          |--------------------|:-------------:|:--------------------:|
          | - Vaat             | - Dryer       |  - Washingmachine    |



            Wake NAS
              - Nas

            Toaster
              - broodrooster

          ___
          **Activities:**
            Aan de slag
              - Werk

            Gaming
              - Xbox

            Gym
              - Sports

            Home theater
              - Film kijken
              - Bioscoop
              - Movie

            Naar bed
              - Turn in

            Opstaan
              - Wakker worden
              - Wakeup

            Selamat makan
              - Aan tafel
              - Eten

            Slapen
              - Wel te rusten

            Thuis
              - Arrive home

            Uit huis
              - Leave home

          ___
          **Verlichting:**

            Den
              - Wandverlichting

            Aan de slag verlichting
              - Werk licht
              - Work lights

            Game verlichting
              - Xbox licht
              - Game lights

            Gym verlichting
              - Sport licht
              - Gym licht
              - Gym lights

            Home theater verlichting
              - Tv licht
              - Film licht
              - Movie lights

            Lees verlichting
              - Lees licht
              - Reading lights

            Bed verlichting
              - Bed licht
              - Bed lights

            Opstaan verlichting
              - Wakker licht
              - Opstaan licht
              - Ochtend licht
              - Morning lights

            Selamat makan verlichting
              - Diner licht
              - Eet licht
              - Diner lights

            Slapen verlichting
              - Slaap licht
              - Sleep lights

      - type: custom:button-card
        template: horizontal-filler
2

ditched the table idea. Too much to fiddle and no perfect result.

Solved it for now with a few fold-entity-row cards and separated includes (might stylish the border-shadow or not, need to decide wether I like the 3d effect…):

48
48400×691 35.6 KB

card:

type: custom:vertical-stack-in-card
cards:
  - type: custom:hui-markdown-card
    title: >
      Home-assistant Aliases
    style: |
      ha-card { background: 'var(--paper-card-background-color)'; }
    content: |
      ___
      <b>Ok/Hey Google,</b>
      --> <i>'activity/mode'</i> <b>activeren</b>
      --> <b>turn-on/off</b> <i>'switch/verlichting'</i>
      --> <i>'switch/verlichting'</i> <b>in-/uitschakelen</b>

  - type: custom:fold-entity-row
    head:
      type: section
      label: Set commands
    entities:
      - !include /config/lovelace/includes/include_alias_set_commands.yaml

  - type: custom:fold-entity-row
    head:
      type: section
      label: Switches
    entities:
      - !include /config/lovelace/includes/include_alias_switches.yaml

  - type: custom:fold-entity-row
    head:
      type: section
      label: Activities
    entities:
      - !include /config/lovelace/includes/include_alias_activities.yaml

  - type: custom:fold-entity-row
    head:
      type: section
      label: Lighting
    entities:
      - !include /config/lovelace/includes/include_alias_lighting.yaml

  - type: custom:fold-entity-row
    head:
      type: section
      label: Modes
    entities:
      - !include /config/lovelace/includes/include_alias_modes.yaml
3

@Mariusthvdb I see you have settled on another option but if you want to revisit Markdown Tables look here and there is a table generator here

For Markdown in general try here

I agree they are fiddly but once properly sorted they do look pretty effective.

I have used them in a separate view using the Markdown Card:

  - title: MARKDOWN
    cards:
      - type: markdown
        content: |
          ## TABLE1
          | Tables   |      Are      |  Cool |
          |----------|:-------------:|------:|
          | col 1 is |  left-aligned | $1600 |
          | col 2 is |    centered   |   $12 |
          | col 3 is | right-aligned |    $1 |
2 Likes
4

thanks, bookmarked!

1 Like