Home Realm Discovery Page Formatting

[anorstrom]

Hi,
We use the Home Realm Discover y page, and the formatting of that one does not look right.

When we arrive at the HRD page where you type in your login name in a box, there is no space around the box, as shown below. And the box/text/button does not look centered.

The "normal" login page (no-HRD) has a nice space over and under the box, like this.

Could this HRD page be adjusted to a nicer look?
Maybe even match the normal login page more?

In my opinion they should both look the same when we are doing the paginated sig-in experiance, with the same text (well, the text I can also change in the onload.js so that is fine).

Kind Regards,
Andreas

[bongiovimatthew-microsoft]

@anorstrom, thanks for reporting this issue! I am going to mark it as "Help Wanted". It looks like the likely problem is the CSS element matching we use. We unfortunately have to use #id matching instead of class matching, and it's possible the element IDs are different for the text box on the HRD page. If that's the case, adding a CSS entry to style the HRD textbox the same as the Username/Password textbox should fix the issue.

[brentcarlson]

I was able to address the HDR to make it look more like Azure/O365 by making these additions to the JavaScript and to the CSS (not sure if this is the best way or not):

CSS:
Element: span.submit, input[type="submit"]
Add left: 215px;
Add bottom: -25px;
Change FROM width: 100%; TO width: 108px;
Change FROM height: 36px; TO height: 32px;

JavaScript:
document.getElementsByClassName('groupMargin')[2].innerHTML = "Enter your work e-mail address and you will be redirected to your organization's sign-in page.
 " ;

Note the
and the @nbsp;