[Feature Request] Format/add indendation

[bcutter]

Hi,

as I was hoping to find a topic in the famous https://community.home-assistant.io/c/projects/frontend section (which unfortunately does not exist) I need to ask this question - or let's call it feature request - here:

Allow to add an indendation (e. g. as option indendation: ' ' which would give 3 spaces) starting with the first line break (\n) so this...

type: custom:flex-table-card
title: ''
clickable: true
entities:
  include: sensor.updates_server
  exclude: null
columns:
  - name: ' Available updates'
    data: packages
    prefix: '🟢 '
    suffix: ''
    align: left
    icon: mdi:package-down

can look like this, which would greatly enhance the readability:

I read all the styling sections twice but could not find an existing solution for this.
In case there already is a working solution for this, please let me know.

[ildar170975]

You are asking about customizing this indent:

But it cannot be just set up by defining spaces (indendation: ' ').
To align elements properly you need to use a width of your "bullet" image, a width of a space width between the bullet and the text.
Try another way - place the bullet and the text in different columns.

[bcutter]

Try another way - place the bullet and the text in different columns.

Good idea. I tried to create a "fake" column but the whole table is not shown unless providing a valid data selection. null, etc. does not work.

Instead of trying to digg deeper in such a workaround, I would rather redefine my feature request instead and let the integration take care of this:
e. g. by providing a prefix_column and suffix_column option for defining columns which would simply add a column before or after (left or right of) the currently defined one.

                  - name: ' Available updates'
                    data: apps_updatable
                    prefix_column: '▶ '
                    align: left
                    icon: mdi:package-down

[ildar170975]

is not shown unless providing a valid data selection

Just specify the same entity and set "modify" to show your bullet only.

[bcutter]

I'm not into CSS that much. I know x.replace("on", "🟢 Yes") but that function does not accept wildcards to simply replace all by my neat little green bullet.

And what about the header by the way? I want the header text to span over both columns. So using another column makes things maybe just more complicated...

[ildar170975]

And what about the header by the way? I want the header text to span over both columns. So using another column makes things maybe just more complicated...

https://community.home-assistant.io/t/flex-table-card/461173/2?u=ildar_gabdullin

[bcutter]

OK, great 👍🏼

And how to replace a columns full content with modify?