Help with my layout please

[janreinhardt]

Description

Please, I am having a problem with my layout. I want the section „Monitoring / Docker / Misc“ to be three columns. And not use a responsive fourth column like in the screenshot from my iPad.
The link sections „Repos + Linux“ should be separate and two columns only. How do I achieve that? Would nested groups be the answer? „I have tried everything, but I cant get it to work.“
Below is also my settings.yaml.

Thanks!

homepage version

v0.10.9

Installation method

Docker

Configuration

layout:
  My First Group:
    header: false
    style: row
    columns: 2 
  Monitoring:
  Docker:
  Misc:
  Repos:
  Linux:
  Router:
    header: false
    style: row
    columns: 1

Container Logs

No response

Browser Logs

No response

Troubleshooting

(not relevant)

[owennewo-dev]

Yes nest Monitoring Docker and Misc in another group. And make another group with Repos and Linux nested in it. So your settings.yaml would look like this...

layout:
  My First Group:
    header: false
    style: row
    columns: 2 
  Nested1:
    style: column
    columns: 3
    header: false
    Monitoring:
      style: column
      header: false
    Docker:
      style: column
      header: false
    Misc:
      style: column
      header: false
  Nested2:
    style: column
    columns: 2
    header: false
    Repos:
      style: column
      header: false
    Linux:
      style: column
      header: false
  Router:
    header: false
    style: row
    columns: 1

[janreinhardt]

Thanks for answering!
This does solve half the problem, but there are still funny things going on. I have changed my settings.yaml to this:

layout:
  My First Group:
    header: false
    style: row
    columns: 2
  Nested1:
    style: column
    columns: 3
    Monitoring:
      style: column
    Docker:
      style: column
    Misc:
      style: column
  Nested2:
    style: column
    columns: 2
    Repos:
      style: column
    Linux:
      style: column
  Router:
    header: false
    style: row
    columns: 1

Which gives me this layout:

Why is the 'Router' section in the middle of the homepage, it should be the last section at the bottom?
And why are 'Docker' and 'Misc' in the wrong order??

@owennewo-dev Thanks for your help!

[owennewo-dev]

@janreinhardt the wrong order might be because of how you have things ordered in services.yaml

[janreinhardt]

I have only got one thing in services.yaml:

- Router:
    - FRITZ!Box 5590 Fiber:
        href: https://XXXXXX.myfritz.net:40193
        icon: fritzbox-light
        weight: 9
        widget:
          type: fritzbox
          url: http://192.168.178.1
          fields: ["uptime", "received", "sent"]

@owennewo-dev Do I need to add anything here?
All the other services are auto-added via Docker labels.

[owennewo-dev]

@janreinhardt I haven't ever used service widgets added via docker labels, sorry.

[janreinhardt]

This is all so bogus: maybe its not me and my settings, but a homepage bug instead??

[janreinhardt]

@shamoon Could you please have a quick look at this: is this a bug or is it my settings.yaml and services.yaml mistake?
I have got one service configured in the services.yaml
All my other services are auto-detected from their Docker labels.
My homepage layout is defined in the settings.yaml and working fine except for one little detail (I'd like a fixed 3 column layout for three groups instead of a 4th column). But as soon as I start nesting groups, weird stuff is happening and all groups become disordered instead of ordered.
Do I have to keep on trying or is this a homepage error?

[janreinhardt]

@shamoon I am trying the :dev image and its the same thing.
Putting 'Monitoring' and 'Docker' and 'Misc' in a nested group puts this nested group at the very bottom of the homepage and also displays the three groups in a different order.
This is the settings.yaml

layout:
  My First Group:
    header: false
    style: row
    columns: 2 
  Nested1:
    style: column
    columns: 3
    Monitoring:
      style: column
      columns: 3
    Docker:
      style: column
      columns: 3
    Misc:
      style: column
      columns: 3
  Repos:
    style: column
    columns: 1
  Linux:
    style: column
    columns: 1
  Router:
    header: false
    style: row

and this is the labels on one of the containers:

-l homepage.group="Misc" \
-l homepage.name="Baïkal" \
-l homepage.icon="baikal" \
-l homepage.href="https://raspi5:7443/" \
-l homepage.description="CalDAV+CardDAV server" \
-l homepage.weight="2" \

[janreinhardt]

and some more labels

-l homepage.group="Docker" \
-l homepage.name="Dozzle" \
-l homepage.icon="dozzle.svg" \
-l homepage.href="http://raspi5:8888" \
-l homepage.description="Docker log viewer" \
-l homepage.weight="4" \

[shamoon]

Oh I see, yea this isnt really supported yet. You are trying to create nested groups with just labels and the layout but no actual services in them (in services.yaml). I'll see if I can find some time to work on that

[janreinhardt]

Thank you, Id love if you made that happen.
Non-nested groups with only Docker label services are working perfectly, if one could nest them it would be even more perfect

[shamoon]

I spent some time with this, it's kinda tricky. If youre interested in trying out the docker image tagged feature-asd-layout-only you can let me know if that works for you