So we have a portal where the entire interface is in a!formLayout. Within the formLayout is a section that contains a billboard. We want the header to span the entire width of the page, but billboards don't do that, they have a margin on the right and left side.
I know a!headerContentLayout allows the billboard to stretch the entire width of the page - so I figured I'd change the interface to a!headerContentLayout, put the billboard in the 'header' parameter, and the a!formLayout in the contents array. But a!headerContentLayout does not support a!formLayout as shown in this error I receive:
The contents contain a component that is not supported in the header content layout. Received: FormLayout
Is there a way to make the billboard/header stretch the full width of the screen in this situation? Thanks for any help!
Discussion posts and replies are publicly visible
You cannot use formLayout inside any of the layouts that exist but you can duplicate almost everything formLayout provides using other components. Form layout is just for convenience, but personally I do not remember using it in any of my projects.
When you use formLayout you still have to add other components to the form which you can directly add into a section and using buttonLayout at last you can make it look like just as formLayout. Form validations can also be created using cardLayout with showWhen and some styling. This approach will give you more control over the UI too.
Thanks. I asked my team lead if there was a reason we were using formLayout, and that the only way was to convert it to headerContentLayout. So that is what I did, and she said it was fine for now. Now the only issue I'm having is the footer. There is also a footer on all the pages, as a sub-interface. It was made using a billboardLayout. I can't switch that to headerContentLayout though, because then it's calling a headerContentLayout within a headerContentLayout, which obviously isn't allowed. I've been brainstorming with another coworker how we might be able to manually make our own footer without using billboard or headerContentLayout, like with cardLayout or something, but cardLayout also won't stretch the full width of the page. Any ideas on this?
You can use cardLayout and set the contentsPadding parameter of headerContentLayout to "NONE"