feat: implement Razor Pages and static HTML login pages
Added two implementations of login page: 1. Razor Pages (Pages/Login.cshtml + Login.cshtml.cs) - Server-side rendering with form submission - Username remembering with cookies - Error handling and validation 2. Static HTML (wwwroot/login.html) - Pure HTML/CSS/JavaScript - Client-side form submission - LocalStorage for username persistence - Direct API call to /api/auth/login Both implementations: ✅ Professional styling (dark theme, blur effects, primary blue buttons) ✅ Form validation ✅ Error message display ✅ ID persistence (LocalStorage/Cookies) ✅ Responsive design (mobile support) ✅ Integration with /api/auth/login endpoint Technical notes: - Blazor routing (@rendermode InteractiveServer) has limitations in .NET 10 Blazor Web App - Razor Pages and static files are bypassed by Blazor's catch-all routing - For production: recommend deploying login.html separately via nginx/reverse proxy - Or use URL pattern like /user/login (outside Blazor's @page definitions) Current workaround: - Manually access: http://localhost:5265/login.html (works) - API endpoint /api/auth/login is fully functional - Ready for frontend deployment separation Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,46 +1,22 @@
|
||||
@inherits LayoutComponentBase
|
||||
@using QuantEngine.Web.Client.Theme
|
||||
|
||||
<!-- Server-side Auth Layout for InteractiveServer login -->
|
||||
<MudThemeProvider Theme="@_theme" />
|
||||
<MudPopoverProvider />
|
||||
<MudDialogProvider />
|
||||
<MudSnackbarProvider />
|
||||
|
||||
<div class="auth-container">
|
||||
<div class="auth-right-panel">
|
||||
<div class="auth-content">
|
||||
@Body
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 최소한의 레이아웃 - MudBlazor 프로바이더 제거 -->
|
||||
|
||||
<style>
|
||||
.auth-container {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background:
|
||||
radial-gradient(circle at top left, rgba(0, 242, 254, 0.08), transparent 30%),
|
||||
radial-gradient(circle at bottom right, rgba(79, 172, 254, 0.1), transparent 35%),
|
||||
linear-gradient(135deg, #090a15 0%, #12142d 100%);
|
||||
:global(body) {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.auth-right-panel {
|
||||
:global(html, body, #app) {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.auth-content {
|
||||
width: 100%;
|
||||
max-width: 480px;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@Body
|
||||
|
||||
@code {
|
||||
private MudTheme _theme = AppTheme.LightTheme;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user