홈과 관리자 로그인 화면 테마 및 제목 정리

TaxBaik.Web/Components/Admin/Pages/Login.razor

@@ -12,7 +12,7 @@
 <PageTitle>로그인</PageTitle>
 
 <div class="admin-login-page">
-    <div class="admin-login-card">
+    <div class="admin-login-card admin-surface">
         <div class="admin-login-brand">
             <span class="admin-brand-mark">T</span>
             <div>
@@ -22,14 +22,15 @@
         </div>
 
         <form class="admin-login-form" @onsubmit="HandleLogin" @onsubmit:preventDefault>
-            <FluentTextInput Label="사용자명"
+            <label class="admin-field">
-                             Placeholder="사용자명"
+                <span class="admin-field-label">사용자명</span>
-                             @bind-CurrentValue="model.Username" />
+                <input class="admin-input" type="text" placeholder="사용자명" @bind="model.Username" autocomplete="username" />
+            </label>
 
-            <FluentTextInput Label="비밀번호"
+            <label class="admin-field">
-                             Placeholder="비밀번호"
+                <span class="admin-field-label">비밀번호</span>
-                             Type="InputType.Password"
+                <input class="admin-input" type="password" placeholder="비밀번호" @bind="model.Password" autocomplete="current-password" />
-                             @bind-CurrentValue="model.Password" />
+            </label>
 
             <label class="admin-login-remember">
                 <input type="checkbox" @bind="model.RememberMe" />
@@ -38,10 +39,10 @@
 
             @if (!string.IsNullOrEmpty(errorMessage))
             {
-                <div class="admin-inline-alert error">@errorMessage</div>
+                <div class="admin-inline-alert error" role="alert">@errorMessage</div>
             }
 
-            <button type="submit" class="admin-login-submit" disabled="@isLoading">
+            <button type="submit" class="site-button primary admin-login-submit" disabled="@isLoading">
                 @if (isLoading)
                 {
                     <span>로그인 중...</span>

TaxBaik.Web/Components/Site/Home.razor

@@ -1,3 +1,4 @@
+@page "/"
 @using TaxBaik.Application.Seasonal
 @using TaxBaik.Application.Services
 @inject SeasonalMarketingService SeasonalMarketingService

TaxBaik.Web/wwwroot/css/admin.css

@@ -221,126 +221,111 @@ textarea:focus-visible {
    Login Page Styles
    ============================================================================ */
 
-.admin-login-page.mud-container {
+.admin-login-page {
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+  padding: 24px;
+  background:
+    radial-gradient(circle at top left, rgba(200, 157, 110, 0.18), transparent 36%),
+    radial-gradient(circle at bottom right, rgba(46, 92, 78, 0.12), transparent 32%),
+    linear-gradient(180deg, #f9f7f3 0%, #f3ede2 100%);
+}
+
+html.admin-login-route body {
+  background:
+    radial-gradient(circle at top left, rgba(200, 157, 110, 0.18), transparent 36%),
+    radial-gradient(circle at bottom right, rgba(46, 92, 78, 0.12), transparent 32%),
+    linear-gradient(180deg, #f9f7f3 0%, #f3ede2 100%);
+}
+
+.admin-login-card {
+  width: min(440px, 100%);
+  padding: 28px;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  border-radius: 20px;
+}
+
+.admin-login-brand {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+}
+
+.admin-brand-mark {
+  width: 48px;
+  height: 48px;
+  border-radius: 16px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
+  color: #fff;
+  font-size: 1.1rem;
+  font-weight: 800;
+  flex: 0 0 auto;
+}
+
+.admin-brand-title {
+  font-size: 1.15rem;
+  font-weight: 800;
+  color: var(--color-text);
+  line-height: 1.2;
+}
+
+.admin-brand-subtitle {
+  margin-top: 2px;
+  color: var(--color-text-light);
+  font-size: 0.92rem;
+}
+
+.admin-login-form {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.admin-field {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.admin-field-label {
+  font-size: 0.92rem;
+  font-weight: 700;
+  color: var(--color-text);
+}
+
+.admin-login-remember {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 0.95rem;
+  color: var(--color-text-light);
+}
+
+.admin-inline-alert {
+  padding: 12px 14px;
+  border-radius: 12px;
+  border: 1px solid rgba(198, 40, 40, 0.2);
+  background: rgba(198, 40, 40, 0.08);
+  color: var(--color-danger);
+  font-size: 0.95rem;
+}
+
+.admin-login-submit {
   width: 100%;
-  margin: 0 auto;
+  margin-top: 6px;
 }
 
-.admin-login-page.mud-container-maxwidth-small {
+.admin-login-submit:disabled {
-  max-width: 480px !important;
+  opacity: 0.7;
-}
-
-.admin-login-page .mud-paper {
-  background-color: var(--bg-primary);
-  border-radius: var(--radius-lg);
-  box-shadow: var(--shadow-md);
-  padding: var(--space-8);
-}
-
-.admin-login-page .mud-paper.elevation-3 {
-  box-shadow: var(--shadow-lg);
-}
-
-.admin-login-page .mud-typography {
-  color: var(--text-primary);
-  line-height: var(--line-height-normal);
-}
-
-.admin-login-page .mud-typography--h4 {
-  font-size: var(--font-size-3xl);
-  font-weight: var(--font-weight-semibold);
-  color: var(--primary-color);
-  margin-bottom: var(--space-4);
-}
-
-.admin-login-page .mud-typography--body1 {
-  font-size: var(--font-size-base);
-}
-
-.admin-login-page input[type="text"],
-.admin-login-page input[type="password"] {
-  width: 100%;
-  padding: var(--space-3) var(--space-4);
-  margin-bottom: var(--space-4);
-  border: 1px solid var(--border-color);
-  border-radius: var(--radius-md);
-  font-family: inherit;
-  font-size: var(--font-size-base);
-  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
-  background-color: var(--bg-primary);
-  color: var(--text-primary);
-  min-height: 44px;
-}
-
-.admin-login-page input[type="text"]:focus,
-.admin-login-page input[type="password"]:focus {
-  outline: none;
-  border-color: var(--primary-color);
-  box-shadow: 0 0 0 3px var(--primary-light);
-}
-
-.admin-login-page label {
-  display: block;
-  margin-bottom: var(--space-2);
-  font-weight: var(--font-weight-medium);
-  color: var(--text-primary);
-  font-size: var(--font-size-sm);
-}
-
-.admin-login-page button {
-  width: 100%;
-  padding: var(--space-3) var(--space-6);
-  margin-top: var(--space-4);
-  background-color: var(--primary-color);
-  color: var(--primary-contrast);
-  border: none;
-  border-radius: var(--radius-md);
-  font-size: var(--font-size-base);
-  font-weight: var(--font-weight-semibold);
-  cursor: pointer;
-  transition: background-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-  min-height: 44px;
-}
-
-.admin-login-page button:hover {
-  background-color: var(--primary-dark);
-  box-shadow: var(--shadow-md);
-  transform: translateY(-1px);
-}
-
-.admin-login-page button:active {
-  transform: translateY(0);
-}
-
-.admin-login-page button:disabled {
-  background-color: var(--text-disabled);
   cursor: not-allowed;
   transform: none;
-}
+  box-shadow: none;
-
-.admin-login-page .mud-alert {
-  padding: var(--space-3) var(--space-4);
-  margin-bottom: var(--space-4);
-  border-radius: var(--radius-md);
-  border-left: 4px solid transparent;
-}
-
-.admin-login-page .mud-alert--error {
-  background-color: var(--error-light);
-  color: var(--error-dark);
-  border-left-color: var(--error-color);
-}
-
-.admin-login-page .mud-alert--success {
-  background-color: var(--success-light);
-  color: var(--success-dark);
-  border-left-color: var(--success-color);
-}
-
-.admin-login-page .mud-alert--info {
-  background-color: var(--info-light);
-  color: var(--info-dark);
-  border-left-color: var(--info-color);
 }
 
 /* Reconnect Modal */

TaxBaik.Web/wwwroot/js/admin-session.js

@@ -1,8 +1,13 @@
 window.taxbaikAdminSession = {
     syncRouteClass: function () {
+        const isLogin = window.location.pathname.toLowerCase().endsWith('/admin/login');
         document.documentElement.classList.toggle(
             'admin-login-route',
-            window.location.pathname.toLowerCase().endsWith('/admin/login'));
+            isLogin);
+
+        if (isLogin) {
+            document.title = '백원숙 세무회계 - 관리자 로그인';
+        }
     },
 
     getViewportWidth: function () {