feat: add <sg-govt-banner-component> to top of public forms

[jia1]

Problem

Closes #969

Before & After Screenshots

BEFORE:

AFTER:
With info banner


Without

Deploy Notes

The indentation of the text A Singapore Government Agency Website looks strange on form pages.

[karrui]

Have you tested how the SG Govt masthead will look with a banner message? You can simulate a notification banner by adding

IS_GENERAL_MAINTENANCE="some test message"

to the environment key in docker-compose.yml

[r00dgirl]

@karrui @jia1 can we fix the weird indent

[karrui]

@karrui @jia1 can we fix the weird indent

So we change the indent on public form view to fit the current margins of the public form view yes?

Landing page indent do not need to change.

@jia1 will probably just need to add a flag to the to switch to a bigger padding on the public form view.

[jia1]

@karrui @jia1 can we fix the weird indent

@syan-syan Yes, definitely. Just confirming that you don't want the indent to be there (move the text to the left)? Will post with screenshots once I'm done.

[jia1]

Have you tested how the SG Govt masthead will look with a banner message? You can simulate a notification banner by adding

IS_GENERAL_MAINTENANCE="some test message"

to the environment key in docker-compose.yml

Only managed to make this work by specifying the variable and value in .env and specifying the variable in docker-compose.yml. I used SITE_BANNER_CONTENT. I've also attached the screenshots of how forms look like with the site banner and govt banner.

It's easier to let the site banner stay on top because it belongs to banner.html which I presume is situated above start-page.html.

[karrui]

It's easier to let the site banner stay on top

May actually be fine, will just need to see if notification banners will block the masthead (when present)!

Couple avenues to try:

1. You may want to try to shift the masthead to src/public/modules/forms/base/views/submit-form.client.view.html above where the banner-component is situated
2. Shift banner-component into src/public/modules/forms/base/directiveViews/submit-form.directive.view.html and the govt masthead component into submit-form.client.view.html

so the masthead will always be at the top. Make sure to check if scrolling will hide the masthead (when there are info banners up) or if the padding is off.

[karrui]

As discussed, will pull and update screenshots and double check behaviour

[karrui]

lgtm, @syan-syan for your UI approval

[r00dgirl]

lgtm!