[app-layout] Assign part to content div to allow easier "global" styling

[stefanuebe]

Describe your motivation

I want content shown in the app layout to be of full size by default. To not having the dev to set this for each view, I simply want to do that via css. Unfortunately there is no direct way to target the content div inside the shadow dom nor is the slotted component marked in any way (like slot="content").

Describe the solution you'd like

The content div should have a part attribute "content" similar to all the other parts of the app layout (like "drawer", "navbar", etc.)

Describe alternatives you've considered

Using themes plus the "components" folder and shadow dom styling.
Override the showRouterLayoutContent() / setContent() methods in the app layout (in Flow).

Additional context

This issue came up in Flow, not sure if it is also a problem using the webcomponent in Hilla or similar.

[rolfsmeds]

There is in fact a way to target the child of the content slot:
vaadin-app-layout > :not([slot])

(We should mention this in the selector list on the Styling tab.)