ydeng/props
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated some UI.

Browse Source 
Updated app loading UI.

Updated UI for various authentication states.

Updated authentication buttons in the client.
This commit is contained in:
Harrison Deng 2021-05-23 14:15:38 -05:00
parent ac13a6352b
commit 549d9d7e99
4 changed files with 57 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/MultiShop/Client/App.razor
View File

@ -25,7 +25,16 @@
} }
else else
{ {
<p>Loading modules...</p> <div class="d-flex flex-column align-items-center justify-content-center" style="width: 100vw; height: 100vh;">
<div class="my-1">
<div class="spinner-border text-success" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
<div class="my-1">
Downloading shop modules...
</div>
</div>
} }
</Found> </Found>
<NotFound> <NotFound>

16
src/MultiShop/Client/Pages/Authentication.razor
View File

@ -5,21 +5,25 @@
<RemoteAuthenticatorView Action="@Action"> <RemoteAuthenticatorView Action="@Action">
<LoggingIn> <LoggingIn>
<div class="d-flex justify-content-center flex-column" style="width: 100%;"> <div class="d-flex flex-column align-items-center justify-content-center" style="width: 100%;">
<div class="spinner-border text-primary mx-auto my-2" role="status"> <div class="my-1">
<div class="spinner-grow text-primary" role="status">
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
<div class="mx-auto my-2"> </div>
<div class="my-1 text-muted">
Hang on just a sec. We're sending you to go login! Hang on just a sec. We're sending you to go login!
</div> </div>
</div> </div>
</LoggingIn> </LoggingIn>
<Registering> <Registering>
<div class="d-flex justify-content-center flex-column" style="width: 100%;"> <div class="d-flex flex-column align-items-center justify-content-center" style="width: 100%;">
<div class="spinner-border text-primary mx-auto my-2" role="status"> <div class="my-1">
<div class="spinner-grow text-primary" role="status">
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
<div class="mx-auto my-2"> </div>
<div class="my-1 text-muted">
Hang on just a sec. We're sending you to go sign up! Hang on just a sec. We're sending you to go sign up!
</div> </div>
</div> </div>

18
src/MultiShop/Client/Shared/NavMenu.razor
View File

@ -29,19 +29,29 @@
</NavLink> </NavLink>
</li> </li>
</ul> </ul>
<ul class="navbar-nav ml-auto">
<AuthorizeView Context="auth"> <AuthorizeView Context="auth">
<Authorized> <Authorized>
<a href="authentication/profile">Hello, @auth.User.Identity.Name!</a> <li class="nav-item">
<button class="nav-link btn btn-link" @onclick="BeginSignOut">Log out</button> <a class="nav-link" href="authentication/profile">Hello, @auth.User.Identity.Name!</a>
</li>
<li class="nav-item">
<button class="nav-link btn btn-outline-primary" @onclick="BeginSignOut">Log out</button>
</li>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
@if (Configuration["IdentityServer:Registration"].Equals("enabled")) @if (Configuration["IdentityServer:Registration"].Equals("enabled"))
{ {
<a class="mx-1" href="authentication/register">Register</a> <li class="nav-item">
<a class="nav-link" href="authentication/register">Register</a>
</li>
} }
<a class="mx-1" href="authentication/login">Log in</a> <li class="nav-item">
<a class="nav-link" href="authentication/login">Log in</a>
</li>
</NotAuthorized> </NotAuthorized>
</AuthorizeView> </AuthorizeView>
</ul>
</div> </div>
</nav> </nav>

13
src/MultiShop/Client/wwwroot/index.html
View File

@ -12,7 +12,18 @@
</head> </head>
<body> <body>
<div id="app">Loading...</div> <div id="app">
<div class="d-flex flex-column align-items-center justify-content-center" style="width: 100vw; height: 100vh;">
<div class="my-1">
<div class="spinner-border text-primary" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
<div class="my-1 text-muted">
Loading app...
</div>
</div>
</div>
<div id="blazor-error-ui"> <div id="blazor-error-ui">
An unhandled error has occurred. An unhandled error has occurred.