Please provide us with the following information:

This issue is for a: (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

Get the Ocean blue template and run it in Azure. When the user tries to Sign In without providing a password, a error message will appear on the top of the password field and the "Forgot Password" link will be on top of the "Password" field.

Any log messages given by the failure

Expected/desired behavior

The "Forgot Password" link should be pushed down when the error message appears, instead of going on top of the password field.

OS and Version?

Windows 7, 8 or 10. Linux (which distribution). macOS (Yosemite? El Capitan? Sierra?)
Azure Custom policies.

Versions

Mention any other details that might be useful

---

Thanks! We'll be in touch soon.

I can't get these files to produce functional copies of the templates.
If you copy the assets, ocean blue and slate grey directories to blob storage, do all the CORS stuff to make them accessible, and then try to access them through, say, the unified.html file, they work. You get the expected page without the embedded section that the AAD B2C site inserts.
If you use them with AAD B2C, however, they don't work, because all the relative links are interpreted as being based on the local AAD B2C address, meaning that the browser cannot find the css files and the images.
I could go through the templates and make all relative addresses absolute - there's around 20 of them, but I can't help thinking I'm missing something? How do you intend this to work?

Please provide us with the following information:

This issue is for a: (mark with an x)

- [ ] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [x] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

1.) Use this template for the latest Page Layout version (2.1.0)
2.) Observe that many elements are not styled appropriately.

Any log messages given by the failure

N/A

Expected/desired behavior

The CSS from this repository to render all elements the same way using the built-in templates do.

OS and Version?

N/A

Versions

Azure Page Layout

Mention any other details that might be useful

I've found that a number of the element IDs have changed in a way where they no longer to work with this template. For example, #email_ver_but_send now appears to be #emailVerificationControl_but_send_code, #logonIdentifier or #signInName now appears to be , #email. This repository should be updated when the page layout versions change.

Please provide us with the following information:

The data-preload=true attribute is causing a Security issue in edge 18, and causes edge to not render the flow UI. This works fine on Chrome / Mozilla / Edge Chromium

This issue is for a: (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

In the script or link tags in head add data-preload

<script src="sample.com/sample.js" data-preload=true/>

Any log messages given by the failure

Security error

Expected/desired behavior

OS and Version?

Windows 7, 8 or 10. Linux (which distribution). macOS (Yosemite? El Capitan? Sierra?)
Windows 10

Versions

Page layout 1.2.0

Mention any other details that might be useful

---

Thanks! We'll be in touch soon.

This issue is for a: (mark with an x)

- [ X] bug report -> please search issues before submitting
- [ ] feature request
- [X ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

1. Get these Templates
2. Put the template files for "assets" and ocean_blue on you Blob storage
3. Modify all so references are absolute to the locations on Blob storage
4. Upload the modified files to Blob storage
5. Setup a B2C tenant
6. Adjust your blob storage to allow CORS as per Azure B2C docs
7. Get the starter local custom policy files
8. Modify the local custom policies and modify the TrustFrameworkBase.xml as follows for the api.signuporsignin:
   
   
   https:///ocean_blue/unified.html
   ~/common/default_page_error.html
   urn:com:microsoft:aad:b2c:elements:unifiedssp:1.0.0
   
   Signin and Signup
   
   
9. Upload your custom policy files
10. Now try your new custom B2C_1A_signup_signin user flow

The "Email" field does not render properly

Any log messages given by the failure

Expected/desired behavior

I expect both the Email and Password fields to render identically.

If you use the EXACT same html file in a custom SignupSignIn user flow you created from the basic V1 flow the "Email" field displays just like the "Password" field (when you select the templates).

I would expect that a "Sample" that is provided would at the very least render the page correctly and as the "Email" section is inserted it is very difficult to guess what someone has changed so that the sample no longer actually works

OS and Version?

Windows 7, 8 or 10. Linux (which distribution). macOS (Yosemite? El Capitan? Sierra?)

Windows 10

Versions

Mention any other details that might be useful

---

Thanks! We'll be in touch soon.

This issue is for a: (mark with an x)

- [ ] bug report -> please search issues before submitting
- [ ] feature request
- [X] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

There is a newer more up to date repository for these templates, that also includes an updater program to download the latest versions at any time. It lives over in https://github.com/azure-ad-b2c/html-templates. This repository should ideally be updated to point users over there (or otherwise be merged with that one).

Please provide us with the following information:

This issue is for a: (mark with an x)

- [X ] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

Follow the steps on the readme to upload the template to blob storage. Update your custom policy to use the api.signuporsignin contentdefinition

Any log messages given by the failure

NA

Expected/desired behavior

The email address field should be styled the same as the password field.

OS and Version?

Windows 10

Versions

Mention any other details that might be useful

---

Thanks! We'll be in touch soon.

Please provide us with the following information:

This issue is for a: (mark with an x)

- [x ] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

Initiate sign-up/sign-in flow using a custom template
Enter email address and password
Press sign in

Any log messages given by the failure

n/a

Expected/desired behavior

Loading animation should show between the password field and the sign-in button

OS and Version?

Chrome

Versions

n/a

Mention any other details that might be useful

The common.css files in this repo should contain the following rule:

#api .working {
background: url(data:image/gif;base64,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) no-repeat;
height: 30px;
width: auto;
background-position: center bottom;
}

Without this rule, no loading animation is shown.

The unified.css and selfAsserted.css files should contain the following rule:

.working {
display: none;
}

Without these rules, the animation will be shown on page load.

When addressing this issue could you provide information about how this has been missed out? It makes me worry that other CSS rules are missing from the templates.

Please provide us with the following information:

This issue is for a: (mark with an x)

- [ x ] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

1. Open common.css
2. Search for #SignInWithLogonNameExchange on line 60
3. See strange css background-image: url(none);

Any log messages given by the failure

none but goes wrong with parsing of html in visual studio code.

Expected/desired behavior

1. background-image: url(none); should be changed to background-image: none; for valid css.

OS and Version?

Windows 10

Versions

latest

Mention any other details that might be useful

none

---

Thanks! We'll be in touch soon.

Please provide us with the following information:

This issue is for a: (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request
- [ ] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

Create a simple ui and load the login screen. The tab order is:
Email
forget password link
password
submit button

Any log messages given by the failure

Expected/desired behavior

Want the expected order:
email field
password field
fortget password link
submit button

OS and Version?

Windows 7, 8 or 10. Linux (which distribution). macOS (Yosemite? El Capitan? Sierra?)

Versions

Mention any other details that might be useful

---

Thanks! We'll be in touch soon.