go2ismail/blazor-crm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
go2ismail
2026-07-21 13:59:38 +07:00
commit c40792266a
1321 changed files with 100465 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Features/Account/AuthenticationLayout.razor
+436
View File
@@ -0,0 +1,436 @@
@using Indotalent.Shared.Consts
@inherits LayoutComponentBase
@inject NavigationManager Navigation
<MudThemeProvider @bind-IsDarkMode="isDarkMode" Theme="_theme" />
<MudDialogProvider />
<MudSnackbarProvider />
<MudPopoverProvider />
<style>
/* ===== FONTS ===== */
@@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
* { margin: 0; padding: 0; box-sizing: border-box; }
/* ===== SPLIT CONTAINER ===== */
.auth-split-container {
display: flex;
min-height: 100vh;
width: 100%;
font-family: "Poppins", sans-serif;
}
/* ===== LEFT PANEL ===== */
.auth-left-panel {
display: none;
position: relative;
background: linear-gradient(135deg, #6366F1 0%, #5558e6 30%, #4f51d4 60%, #7c74fc 100%);
overflow: hidden;
}
.auth-left-panel::before {
content: '';
position: absolute;
top: -120px;
right: -120px;
width: 340px;
height: 340px;
border-radius: 50%;
background: rgba(255,255,255,0.06);
}
.auth-left-panel::after {
content: '';
position: absolute;
bottom: -80px;
left: -80px;
width: 240px;
height: 240px;
border-radius: 50%;
background: rgba(255,255,255,0.04);
}
.auth-left-content {
position: relative;
z-index: 1;
max-width: 28rem;
padding: 3rem;
width: 100%;
}
.auth-brand-row {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 2rem;
}
.auth-brand-icon {
width: 3.5rem;
height: 3.5rem;
background: rgba(255,255,255,0.2);
backdrop-filter: blur(8px);
border-radius: 0.75rem;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.2s;
}
.auth-brand-icon:hover {
background: rgba(255,255,255,0.3);
}
.auth-brand-name {
display: flex;
flex-direction: column;
}
.auth-brand-name span:first-child {
font-size: 1.5rem;
font-weight: 700;
color: #ffffff;
line-height: 1.2;
letter-spacing: -0.5px;
}
.auth-brand-name span:last-child {
font-size: 0.8125rem;
color: #c7c3ff;
font-weight: 400;
}
.auth-welcome-title {
font-size: 1.875rem;
font-weight: 700;
color: #ffffff;
line-height: 1.25;
margin-bottom: 1rem;
}
.auth-welcome-desc {
font-size: 0.875rem;
color: #c7c3ff;
line-height: 1.65;
margin-bottom: 2rem;
}
.auth-feature-list {
display: flex;
flex-direction: column;
gap: 1rem;
margin-bottom: 2.5rem;
}
.auth-feature-item {
display: flex;
align-items: flex-start;
gap: 0.75rem;
}
.auth-feature-check {
width: 1.25rem;
height: 1.25rem;
border-radius: 0.25rem;
background: rgba(255,255,255,0.2);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
margin-top: 0.125rem;
}
.auth-feature-check svg {
width: 0.75rem;
height: 0.75rem;
color: #ffffff;
}
.auth-feature-text strong {
display: block;
font-size: 0.8125rem;
font-weight: 600;
color: #ffffff;
}
.auth-feature-text p {
font-size: 0.75rem;
color: #c7c3ff;
margin-top: 0.125rem;
}
.auth-support-card {
padding: 1rem;
background: rgba(255,255,255,0.1);
backdrop-filter: blur(8px);
border: 1px solid rgba(255,255,255,0.2);
border-radius: 0.75rem;
display: flex;
align-items: center;
gap: 0.75rem;
}
.auth-support-icon {
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
background: rgba(255,255,255,0.2);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.auth-support-icon svg {
width: 1.25rem;
height: 1.25rem;
color: #ffffff;
}
.auth-support-text strong {
display: block;
font-size: 0.8125rem;
font-weight: 600;
color: #ffffff;
}
.auth-support-text span {
font-size: 0.75rem;
color: #c7c3ff;
}
/* ===== RIGHT PANEL ===== */
.auth-right-panel {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 1.5rem;
background: #f8fafc;
}
.auth-form-wrapper {
width: 100%;
max-width: 28rem;
}
/* ===== CARD ===== */
.auth-card {
border-radius: 1rem !important;
box-shadow: 0 4px 24px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04) !important;
border: 1px solid #e2e8f0 !important;
background: #ffffff !important;
}
.auth-card-footer {
display: flex;
justify-content: center;
padding: 0.75rem 1.5rem;
border-top: 1px solid #e2e8f0;
}
.auth-card-footer span {
font-size: 0.75rem;
color: #94a3b8;
font-weight: 500;
letter-spacing: 0.025em;
}
/* ===== MOBILE BRAND STRIP ===== */
.auth-mobile-brand {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
margin-bottom: 1.5rem;
}
.auth-mobile-brand-icon {
width: 2.25rem;
height: 2.25rem;
background: #6366F1;
border-radius: 0.5rem;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.auth-mobile-brand-icon svg {
width: 1.25rem;
height: 1.25rem;
color: #ffffff;
}
.auth-mobile-brand-name {
font-size: 1.125rem;
font-weight: 700;
color: #0f172a;
letter-spacing: -0.5px;
}
/* ===== RESPONSIVE ===== */
@@media (min-width: 1024px) {
.auth-left-panel {
display: flex;
align-items: center;
justify-content: center;
width: 50%;
}
.auth-right-panel {
width: 50%;
}
.auth-mobile-brand {
display: none;
}
}
@@media (min-width: 1280px) {
.auth-right-panel {
padding: 4rem;
}
.auth-left-content {
padding: 4rem;
}
}
</style>
<div class="auth-split-container">
<!-- LEFT PANEL: Branding (visible lg+) -->
<div class="auth-left-panel">
<div class="auth-left-content">
<!-- Brand Logo + Name -->
<div class="auth-brand-row">
<div class="auth-brand-icon" @onclick="NavigateToHome">
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 22 8.5 22 15.5 12 22 2 15.5 2 8.5 12 2" />
<line x1="12" y1="22" x2="12" y2="15.5" />
<polyline points="22 8.5 12 15.5 2 8.5" />
</svg>
</div>
<div class="auth-brand-name">
<span>@GlobalConsts.AppInitial</span>
<span>Blazor CRM Source Code</span>
</div>
</div>
<!-- Welcome Heading -->
<h2 class="auth-welcome-title">Your Complete<br/>CRM Solution</h2>
<p class="auth-welcome-desc">A production-ready Blazor CRM source code that bridges your business and your customers. Sign in to explore the full application.</p>
<!-- Feature Checkmarks -->
<div class="auth-feature-list">
<div class="auth-feature-item">
<div class="auth-feature-check">
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
</svg>
</div>
<div class="auth-feature-text">
<strong>Sales & Pipeline</strong>
<p>Quotation, orders, invoices & reporting</p>
</div>
</div>
<div class="auth-feature-item">
<div class="auth-feature-check">
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
</svg>
</div>
<div class="auth-feature-text">
<strong>Purchase & Inventory</strong>
<p>Procurement, warehouse & stock control</p>
</div>
</div>
<div class="auth-feature-item">
<div class="auth-feature-check">
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
</svg>
</div>
<div class="auth-feature-text">
<strong>Customer & Vendor</strong>
<p>Contacts, groups & relationship tracking</p>
</div>
</div>
<div class="auth-feature-item">
<div class="auth-feature-check">
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
</svg>
</div>
<div class="auth-feature-text">
<strong>System Logs & Settings</strong>
<p>Full control with audit & configuration</p>
</div>
</div>
</div>
<!-- Support Card -->
<div class="auth-support-card">
<div class="auth-support-icon">
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15m3 0l3-3m0 0l-3-3m3 3H9" />
</svg>
</div>
<div class="auth-support-text">
<strong>Production Ready</strong>
<span>Enterprise-grade Blazor CRM source code</span>
</div>
</div>
</div>
</div>
<!-- RIGHT PANEL: Form Area -->
<div class="auth-right-panel">
<div class="auth-form-wrapper">
<!-- Mobile Brand Strip (visible < lg) -->
<div class="auth-mobile-brand">
<div class="auth-mobile-brand-icon" @onclick="NavigateToHome">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 22 8.5 22 15.5 12 22 2 15.5 2 8.5 12 2" />
<line x1="12" y1="22" x2="12" y2="15.5" />
<polyline points="22 8.5 12 15.5 2 8.5" />
</svg>
</div>
<span class="auth-mobile-brand-name">@GlobalConsts.AppInitial</span>
</div>
<!-- Form Card -->
<MudCard Elevation="0" Class="auth-card">
<MudCardContent Class="pa-6 pa-lg-8">
@Body
</MudCardContent>
<div class="auth-card-footer">
<span>&copy; @DateTime.Now.Year @GlobalConsts.AppInitial. ALL RIGHTS RESERVED.</span>
</div>
</MudCard>
</div>
</div>
</div>
@code {
private bool isDarkMode;
private MudTheme _theme = new()
{
PaletteLight = new PaletteLight()
{
Primary = "#6366F1",
Secondary = "#7c74fc",
AppbarBackground = "#6366F1"
}
};
private void NavigateToHome()
{
Navigation.NavigateTo("/", forceLoad: true);
}
}