Column Panel in Standard Page does not have a full_width_row property

Anvil Q&A
1

Hi,
I have this app that uses the Material Design 3, that has a Form (RouterAreaPublica) created with Standard Page .
The Form has a colum panel that I dropped in the place where is says “Drop column panel here”, which I think it is what is called the standard slot.

All the other forms of the app, for example Home (which is in the PaginasPublicas folder), will load inside this column panel. These are created with the Blank Panel.

For now I’m just displaying a label in the forms to test the navigation.
Let’s take the Home form as the test subject (but all the rest of the forms behave the same)
What I have detected is that although in the Home Form I’ve set the label and the column panel that contains it to display with full_width_row, when displaying inside the RouterAreaPublica Form they don’t display full width.

What I could find is:
If I set the Home form as the starting form, it displays fine, so the full_width_row property is working fine in the Home Form.
So the problem appears to be with the column panel of the RouterAreaPublica Form.
Then I examined this column panel and I found that the properties are not the same, and that in the Container Properties, where all the other column panels have the full_width_row, this one doesn’t. Instead it has just a slot property with a value of “default”.

I just don’t understand why the properties for the same element are different , and I couldn’t find a way to set the full_width_row for this particular column panel.
I believe that unless there is something else I’m not aware of (which is highly probable), it should be somewhere between the HTML and the css, but I’m not proficient in those fields, and before breaking anything I will kindly ask if someone can please lead me out of this situation.
I’ll really appreciate it!!! (a brief explanation would be a nice bonus, as it will help me understand something I’m obviously missing :upside_down_face:)

Here is the app so you can check the behavior first hand.
Just press the start app button and you will see the Home label displaying in the middle of the screen (not full width)

Thank you very much!!!

2

I think this might be another routing question. Check out the docs for routing and search full_width_row

https://anvil-extras.readthedocs.io/en/latest/guides/modules/routing.html#full-width-rows

1 Like
3

I was so focused on the component itself that I never thought it could be related to the navigation.
But, as usual you are right!! (when I first read the routing documentation I saw that option, but I was unable to recall it in this situation. I hate when this happens to me :exploding_head:)

I’ve tested your suggestion it and it works as expected!!
It is a bit tricky that you have to set it both in the component and in the navigation, but in the end it all comes to have the knowledge and the instinct (aka experience) to be able to think wider.
I hope some day I’ll get there.