Changing Screen Layout on Portal Harness Breaks Main Nav CSS

User Experience
, , , ,
1

The client is trying to add a footer to their portal using CosmosSkin. The portal harness currently has the screen layout set to “Header left” and to add a footer tried setting it to “Header Left Footer”

This breaks the css and the Main nav (Section: PortalNavigation) becomes transparent with misaligned menu item. It also expands over the entire work area and stays expanded unless resized in css. The work area can still be seen under the menu unless color is added since it is transparent.

Is this expected? Does the css need to be rewritten for the main nav to add a footer?

We are trying to keep the functionality as out of the box as possible even though the main work area will be custom. With this it seems we will need to make the main nav static and not overlap the work area as it currently does. It also covers the header logo and other content while staying full expanded. This will require even more correction to the broken styling.

Is there a better way to configure this?

2

@Marc Alderman @Sam Alexander @Priyanka Boga can someone in the UI team answer this one?

3

@AlexanderNelson - From app studio when we open the portal rule and in configurations tab if we enable display header. In the UserPortal harness rule screen layout configurations we could see a class is getting added “app-header-bar”. The styles related to this class are been added in py-cosmos-portal css file . Similarly we need to create a new class to footer and have to add explicitly styles to support the footer in UserPortal.

Thank you.