Yes, this is a very convenient thing - but now we cannot use a "variable_x" to define a "variable_y" unfortunately - like we could use a "vars[x]" to define a "vars[y]" (Variables: use VARIABLE_1 to define VARIABLE_2 · Issue #47 · iantrich/config-template-card · GitHub). Sometimes it is needed…
For example, with using the old notation the code could be something like this:
variables:
- '''sonoff5_1''' #0
- '''sonoff5_2''' #1
- '''sonoff5_3''' #2
- '''_mqtt_connect_count''' #3
- '''_wifi_connect_count''' #4
- '''_rssi''' #5
- 'states["sensor." + vars[0] + vars[3]]' #6
- 'states["sensor." + vars[0] + vars[4]]' #7
- 'states["sensor." + vars[0] + vars[5]]' #8
- 'states["sensor." + vars[1] + vars[3]]' #9
- 'states["sensor." + vars[1] + vars[4]]' #10
- 'states["sensor." + vars[1] + vars[5]]' #11
- 'states["sensor." + vars[2] + vars[3]]' #12
- 'states["sensor." + vars[2] + vars[4]]' #13
- 'states["sensor." + vars[2] + vars[5]]' #14
entities:
- '${vars[6].entity_id}'
- '${vars[7].entity_id}'
- '${vars[8].entity_id}'
- '${vars[9].entity_id}'
- '${vars[10].entity_id}'
- '${vars[11].entity_id}'
- '${vars[12].entity_id}'
- '${vars[13].entity_id}'
- '${vars[14].entity_id}'
But anyway that is a lot of repeating code.
So it could be better to use a decluttering card:
decl_XXXXXXXXXXXXXX:
card:
type: 'custom:config-template-card'
variables:
- .............. [[SENSOR_XXXXXXXXXX]]
- .............. [[SENSOR_YYYYYYYYYY]]
- .............. [[SENSOR_ZZZZZZZZZZ]]
entities:
- '[[SENSOR_XXXXXXXXXX]]'
- '[[SENSOR_YYYYYYYYYY]]'
- '[[SENSOR_ZZZZZZZZZZ]]'
row:
type: 'custom:multiple-entity-row'
entity: '[[SENSOR_XXXXXXXXXX]]'
entities:
- entity: '[[SENSOR_YYYYYYYYYY]]'
....
- entity: '[[SENSOR_ZZZZZZZZZZ]]'
....
name: .....
unit: .....
icon: .....
toggle: false
show_state: .....
state_header: ''
secondary_info: last-changed
How to use:
entities:
- type: 'custom:decluttering-card'
template: decl_XXXXXXXXXXXXXX
variables:
- SENSOR_XXXXXXXXXX: ..............
- SENSOR_YYYYYYYYYY: ..............
- SENSOR_ZZZZZZZZZZ: ..............
- type: 'custom:decluttering-card'
template: decl_XXXXXXXXXXXXXX
variables:
- SENSOR_XXXXXXXXXX: ..............
- SENSOR_YYYYYYYYYY: ..............
- SENSOR_ZZZZZZZZZZ: ..............
- type: 'custom:decluttering-card'
template: decl_XXXXXXXXXXXXXX
variables:
- SENSOR_XXXXXXXXXX: ..............
- SENSOR_YYYYYYYYYY: ..............
- SENSOR_ZZZZZZZZZZ: ..............
- type: 'custom:decluttering-card'
template: decl_XXXXXXXXXXXXXX
variables:
- SENSOR_XXXXXXXXXX: ..............
- SENSOR_YYYYYYYYYY: ..............
- SENSOR_ZZZZZZZZZZ: ..............
Regarding multiple-entity-row - you may use kind of “styles: width: 150px” to prevent these misalignment:

Regarding using spaces:
'Coffee' + '\xa0'.repeat(16)
This will look nice only in case of using a font with fixed width; for proportional fonts it will cause a misalignment:

You may display these “Fair, Excellent etc” words in the "secondary-info" like it is described here (and even colourize it by card-mod like it is described here):

type: 'custom:config-template-card'
entities:
- sun.sun
card:
type: entities
entities:
- type: 'custom:multiple-entity-row'
entity: sun.sun
entities:
- entity: sun.sun
name: xxx
styles:
width: 60px
- entity: sun.sun
name: xxx
styles:
width: 60px
unit: ''
icon: ''
toggle: false
show_state: false
state_header: ''
state_color: false
secondary_info: '${states[''sun.sun''].state === "above_horizon" ? "Rise and shine" : "Sleep well"}'
Actually, I thought that you were already using this card - your first pic looks like multiple-entity-row…