Cannot access Login/Logout controls on mobile devices

[DuncanSpence]

For examples:-
CslaBlazorAuthentication
BlazorAuthClient
BlazorAuthServer

The Login/Logout controls do not appear on mobile devices - this is because the examples do not contain the 'auth' class as well as the 'top-row' class in the MainLayout.razor file. (

should read

)

The book examples (PP 83 and PP 174) do not identify this change either.

[rockfordlhotka]

Thank you for testing on mobile, I made no effort to test the code on anything other than Chrome and Edge browsers on the desktop.

So you are saying the css classes don't exist on mobile?

[DuncanSpence]

Hi Rocky thanks for the quick response. You can reproduce the problem if you reduce the width of the desktop browser, you get to the point where the SideNav collapses into the hamburger menu and the top row (with the Login/Login and About tags) disappears. The problem is that the definition of the div styled with the class top-row does not also have a class of ‘auth’. When you look at the CSS definition it shows that when the size of the viewport drops below 767px, the div should be hidden, unless it also has the ‘auth’ class. If you generate any Blazor solution without adding authentication the code appears as you show it in the book and your examples. When you generate a solution with any sort of Authentication, the ‘auth’ class is added. For your examples in the book and the example code, you are showing (everywhere) <div class="top-row px-4"> … </div> When you should be showing for those examples where you have added Authorization <div class="top-row px-4 auth"> … </div> Hope this helps. Cheers, Duncan From: Rockford Lhotka <[email protected]> Sent: 26 June 2020 16:25 To: MarimerLLC/BlazorBook <[email protected]> Cc: DuncanSpence <[email protected]>; Author <[email protected]> Subject: Re: [MarimerLLC/BlazorBook] Cannot access Login/Logout controls on mobile devices (#2) Thank you for testing on mobile, I made no effort to test the code on anything other than Chrome and Edge browsers on the desktop. So you are saying the css classes don't exist on mobile? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#2 (comment)> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/AEJJA6KI3USF37JXUCOGGSTRYS4URANCNFSM4OJLIPHQ> . <https://github.com/notifications/beacon/AEJJA6J62NHACLJNABZIXPDRYS4URA5CNFSM4OJLIPH2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOE3A542A.gif>