0

I am successfully using Azure B2C for authentication of a Xamarin project and have delved into customizing the login screen.

I am using the user flow approach using the Azure portal rather than custom policies as it seems easier tbh. The link I used is:

https://learn.microsoft.com/en-us/azure/active-directory-b2c/tutorial-customize-ui

Works well, but on smaller devices such as the iPhone 5s, the screen looks squashed as the nav bar and action bars are grey (circled in green, obviously). See img below.

I would like to change the colour of this navbar, in fact, remove it if possible.

squashed screen

I have been able to customize the content only so far, following the very helpful GitHub:

https://github.com/Azure-Samples/active-directory-external-identities-woodgrove-demo/tree/master/Templates

First a big thank you to @ChrisPadgett for that!

So now I can, for example, change the text given to me by the Azure B2C api injection (the yellow circle of my img) from white to red by changing the elements css as follows:

#api .intro > p, #api h2 {
            color: red !important;
        }

So I have been hunting for a list of the elements passed through by B2C, so that I can override them using CSS. Override the Navbar element for example, but also try to change the actual text "Sign in with your existing account" altogether.

I cannot locate this anywhere and I can't launch it on a browser and strip the css as it may not contain all the options available to me.

I saw in a similar post that the functionality to change the navbar/ action bar had been released as in the last reply in this post:

Styling the custom tab with Xamarin and Azure AD B2C

But I cannot find what the user is referring to anywhere either.

Can someone help me either find a list of these elements that MSFT inject or help me change the colour of this bar?? Many thanks.

Mark
  • 139
  • 3
  • 18
  • 1
    The ROPC flow is only in preview so I am not sure that this is supported yet. Looking into it. https://learn.microsoft.com/en-us/azure/active-directory-b2c/configure-ropc?WT.mc_id=b2c-twitter-masoucou – Marilee Turscak - MSFT Jan 04 '19 at 21:33
  • Thanks @MarileeTurscak-MSFT if Azure AD B2C is your bag at MSFT, any chance you could sneak a peek at this too? https://stackoverflow.com/questions/54057378/azure-ad-b2c-password-reset-link-doesnt-work – Mark Jan 06 '19 at 12:22
  • Ignore my comment @MarileeTurscak-MSFT I found the answer ;-) – Mark Jan 06 '19 at 22:26
  • That's great! What did you find? – Marilee Turscak - MSFT Jan 07 '19 at 17:46
  • Hi! I found this: https://dev.to/muak_x/supplemental-explanation-about-authenticating-users-in-xamarinforms-apps-with-azure-active-directory-b2c-ad-b2c-4j10 . I actually logged it as an answer, but it was deleted for being just anlimk. I only posted the link as it was self-explanatory... not through laziness ;-) – Mark Jan 09 '19 at 01:02
  • Thank you! This blog post is a good find. :) Would you mind posting this as an answer beneath this question so that others who come to this page can get help more easily? – Marilee Turscak - MSFT Jan 09 '19 at 01:10
  • I did originally, but the StackOverflow lads didn’t like it and deleted it... – Mark Jan 09 '19 at 21:50
  • @MarileeTurscak-MSFT how do I contact you/ who can I contact at MSFT if I have an Azure B2C AD problem that has not been answered on SO? – Mark Jan 15 '19 at 00:11
  • The best way to do this is to create a Github issue for a particular B2C document. I monitor all of these for B2C and the doc authors and PG team checks on these as well. Another alternative is to email me at AzCommunity@Microsoft.com and provide the link to this thread. – Marilee Turscak - MSFT Jan 15 '19 at 01:18
  • Thanks @MarileeTurscak-MSFT, email sent. – Mark Jan 15 '19 at 14:28
  • @MarileeTurscak-MSFT sent the message no response though. This is the link: https://stackoverflow.com/questions/54161997/azure-ad-b2c-authentication-dropped-when-navigating-to-an-mvvm-based-page – Mark Jan 16 '19 at 14:30

0 Answers0