2025-09-28 01:28:44 +03:30
|
|
|
|
@attribute [Route(RouteConstants.Main.MainPage)]
|
2025-09-28 07:11:47 +03:30
|
|
|
|
@inject NavigationManager Navigation
|
|
|
|
|
|
|
2025-09-28 10:55:21 +03:30
|
|
|
|
<PageTitle>صفحه اصلی</PageTitle>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<!-- HERO -->
|
|
|
|
|
|
<section id="hero" class="hero-section">
|
|
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large" Class="py-16">
|
|
|
|
|
|
<MudGrid Justify="Justify.Center" AlignItems="AlignItems.Center" Spacing="3">
|
|
|
|
|
|
<MudItem xs="12" md="6">
|
2025-09-28 10:55:21 +03:30
|
|
|
|
<MudChip T="string" Color="Color.Primary" Variant="Variant.Filled" Class="mb-3">جدید</MudChip>
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h3" Class="mud-typography-subtitle1 lh-tight mb-1 hero-title">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
ساخت شبکههای هوشمند با فرصت
|
|
|
|
|
|
</MudText>
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.subtitle1" Class="mud-text-secondary mb-6">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
پلن باینری، شجرهنامه و گزارشهای کارمزدی شفاف — همه در یک پنل بلِیزر.
|
|
|
|
|
|
</MudText>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudStack Row="true" Spacing="3" Class="mb-2">
|
|
|
|
|
|
<MudButton Color="Color.Primary" Size="Size.Large" Class="mud-ripple rounded-pill" OnClick="@(() => Navigation.NavigateTo("#pricing"))">مشاهده قیمتها</MudButton>
|
|
|
|
|
|
<MudButton Variant="Variant.Outlined" Color="Color.Inherit" Size="Size.Large" Class="mud-ripple rounded-pill" OnClick="@(() => Navigation.NavigateTo("#features"))">معرفی پکیجها</MudButton>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
</MudStack>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
|
|
|
|
|
|
<MudItem xs="12" md="6">
|
|
|
|
|
|
<MudPaper Elevation="8" Class="pa-0 rounded-2xl hero-media">
|
|
|
|
|
|
<MudImage Src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?q=80&w=1200&auto=format&fit=crop"
|
|
|
|
|
|
Alt="جلسه تیم فروش و شبکهسازی"
|
|
|
|
|
|
ObjectFit="ObjectFit.Cover"
|
|
|
|
|
|
ObjectPosition="ObjectPosition.Center"
|
|
|
|
|
|
Style="width:100%"
|
|
|
|
|
|
Class="rounded-2xl" />
|
|
|
|
|
|
<div class="hero-overlay"></div>
|
|
|
|
|
|
<div class="hero-badge px-2 pb-2">
|
|
|
|
|
|
<MudText Typo="Typo.subtitle2">نمای لحظهای</MudText>
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">۱۲۸۴ عضو فعال · $۴۸,۹۷۰ پرداختی ماه گذشته</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
</div>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
</MudGrid>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<!-- STATS -->
|
|
|
|
|
|
<section class="stats-strip">
|
|
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large" Class="py-8">
|
|
|
|
|
|
<MudGrid Spacing="2" Justify="Justify.SpaceAround">
|
|
|
|
|
|
<MudItem xs="6" md="3">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="2" Class="pa-4 mud-elevation-2 rounded-xl mud-theme-surface">
|
2025-10-07 02:28:22 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mud-typography-subtitle1" Color="Color.Success">+۵۰٪</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudText Typo="Typo.caption" HtmlTag="div" Align="Align.Center" Color="Color.Info">رشد میانگین شبکه</MudText>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
<MudItem xs="6" md="3">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="2" Class="pa-4 mud-elevation-2 rounded-xl mud-theme-surface text-center">
|
2025-10-07 02:28:22 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mud-typography-subtitle1" Color="Color.Primary">۹۹٫۹٪</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudText Typo="Typo.caption" HtmlTag="div" Align="Align.Center" Color="Color.Info">آپتایم سرویس</MudText>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
<MudItem xs="6" md="3">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="2" Class="pa-4 mud-elevation-2 rounded-xl mud-theme-surface text-center">
|
2025-10-07 02:28:22 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mud-typography-subtitle1" Color="Color.Warning">۳ روز</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudText Typo="Typo.caption" HtmlTag="div" Align="Align.Center" Color="Color.Info">میانگین زمان استقرار</MudText>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
<MudItem xs="6" md="3">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="2" Class="pa-4 mud-elevation-2 rounded-xl mud-theme-surface text-center">
|
2025-10-07 02:28:22 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mud-typography-subtitle1" Color="Color.Secondary">+۲۰ کشور</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudText Typo="Typo.caption" HtmlTag="div" Align="Align.Center" Color="Color.Info">پوشش ارسال کد</MudText>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
</MudGrid>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<!-- FEATURES: معرفی پکیجها -->
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<section id="features" class="py-20">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 mud-typography-subtitle1">پکیجها و امکانات</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="mud-text-secondary mb-8">بر اساس اندازهٔ تیم خود انتخاب کنید.</MudText>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudGrid Spacing="3" Justify="Justify.Center" Class="stretch-grid">
|
|
|
|
|
|
@foreach (var p in _packs)
|
|
|
|
|
|
{
|
|
|
|
|
|
<MudItem xs="12" md="4" Class="d-flex">
|
|
|
|
|
|
<MudPaper Elevation="2" Class="rounded-2xl d-flex flex-column flex-grow-1 overflow-hidden">
|
|
|
|
|
|
<MudImage Src="@p.Image"
|
|
|
|
|
|
Alt="@p.Title"
|
|
|
|
|
|
Height="300"
|
|
|
|
|
|
ObjectFit="ObjectFit.Cover"
|
|
|
|
|
|
ObjectPosition="ObjectPosition.Center"
|
|
|
|
|
|
Class="feature-img" />
|
|
|
|
|
|
<div class="pa-5">
|
|
|
|
|
|
<MudText Typo="Typo.h6" Class="mb-1">@(p.Title)</MudText>
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.body2" Class="mud-text-secondary mb-2">@(p.Body)</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudList T="string" Dense="true">
|
|
|
|
|
|
@foreach (var item in p.Items)
|
|
|
|
|
|
{
|
|
|
|
|
|
<MudListItem T="string" Value="@item">
|
|
|
|
|
|
<MudIcon Icon="@Icons.Material.Filled.Verified" Size="Size.Small" Class="ml-2" />
|
|
|
|
|
|
@item
|
|
|
|
|
|
</MudListItem>
|
|
|
|
|
|
}
|
|
|
|
|
|
</MudList>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
}
|
|
|
|
|
|
</MudGrid>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<!-- PRICING -->
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<section id="pricing" class="py-20">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 mud-typography-subtitle1">قیمتگذاری</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="mud-text-secondary mb-8">قیمتها به تومان — بدون هزینهٔ پنهان.</MudText>
|
2025-09-28 07:11:47 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudGrid Spacing="3" Justify="Justify.Center">
|
|
|
|
|
|
@foreach (var p in _plans)
|
|
|
|
|
|
{
|
|
|
|
|
|
<MudItem xs="12" md="4" Class="d-flex">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudCard Elevation="3" Class="mud-elevation-3 rounded-2xl d-flex flex-column flex-grow-1 mud-theme-surface">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudCardContent Class="pa-6">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.overline" Class="mud-text-secondary">@(p.Name)</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.h4" Class="mud-typography-subtitle1 mb-2">@p.Price</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudList T="string" Dense="true">
|
|
|
|
|
|
@foreach (var item in p.Features)
|
|
|
|
|
|
{
|
|
|
|
|
|
<MudListItem T="string" Value="@item">
|
|
|
|
|
|
<MudIcon Icon="@Icons.Material.Filled.CheckCircle" Size="Size.Small" Class="ml-2" />
|
|
|
|
|
|
@(item)
|
|
|
|
|
|
</MudListItem>
|
|
|
|
|
|
}
|
|
|
|
|
|
</MudList>
|
|
|
|
|
|
</MudCardContent>
|
|
|
|
|
|
<MudCardActions Class="pa-4 pt-0 d-flex justify-center">
|
|
|
|
|
|
<MudButton Color="Color.Primary" FullWidth="true" Variant="@(p.Highlight ? Variant.Filled : Variant.Outlined)">انتخاب پکیج</MudButton>
|
|
|
|
|
|
</MudCardActions>
|
|
|
|
|
|
</MudCard>
|
|
|
|
|
|
</MudItem>
|
|
|
|
|
|
}
|
|
|
|
|
|
</MudGrid>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
2025-09-28 01:28:44 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<!-- TESTIMONIALS -->
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<section id="testimonials" class="py-20 testimonials">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 mud-typography-subtitle1">اعتماد مشتریان</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="mud-text-secondary mb-8">بخشی از تجربهٔ استفاده از «فرصت».</MudText>
|
2025-09-28 01:28:44 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudGrid Spacing="3" Justify="Justify.Center">
|
|
|
|
|
|
<MudItem xs="12" md="6">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="4" Class="mud-elevation-4 rounded-2xl pa-5 mud-theme-surface">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudStack Spacing="2">
|
|
|
|
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
|
|
|
|
<MudAvatar>
|
|
|
|
|
|
<MudImage ObjectFit="ObjectFit.Cover"
|
|
|
|
|
|
ObjectPosition="ObjectPosition.Center"
|
|
|
|
|
|
Src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?q=80&w=256&auto=format&fit=crop"></MudImage>
|
|
|
|
|
|
</MudAvatar>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle2">شرکت سینا نت</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.overline" Class="mud-text-secondary">مدیر عملیات</MudText>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</MudStack>
|
|
|
|
|
|
<MudText Typo="Typo.body2">
|
|
|
|
|
|
«با فرصت، محاسبهٔ کارمزدها و پایش تیمها بدون اکسل و دردسر انجام میشود.»
|
|
|
|
|
|
</MudText>
|
|
|
|
|
|
</MudStack>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudItem>
|
2025-09-28 10:55:21 +03:30
|
|
|
|
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudItem xs="12" md="6">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="4" Class="mud-elevation-4 rounded-2xl pa-5 mud-theme-surface">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudStack Spacing="2">
|
|
|
|
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
|
|
|
|
<MudAvatar>
|
|
|
|
|
|
<MudImage ObjectFit="ObjectFit.Cover"
|
|
|
|
|
|
ObjectPosition="ObjectPosition.Center"
|
|
|
|
|
|
Src="https://images.unsplash.com/photo-1544005313-94ddf0286df2?q=80&w=256&auto=format&fit=crop"></MudImage>
|
|
|
|
|
|
</MudAvatar>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle2">هولدینگ آریانا</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.overline" Class="mud-text-secondary">مدیر فروش</MudText>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</MudStack>
|
|
|
|
|
|
<MudText Typo="Typo.body2">
|
|
|
|
|
|
«شجرهنامهٔ بصری و گزارشهای دقیق باعث شد رشد تیم را لحظهای ببینیم.»
|
|
|
|
|
|
</MudText>
|
2025-09-28 10:55:21 +03:30
|
|
|
|
</MudStack>
|
|
|
|
|
|
</MudPaper>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
</MudItem>
|
|
|
|
|
|
|
|
|
|
|
|
</MudGrid>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- FAQ -->
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<section id="faq" class="py-20">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 mud-typography-subtitle1">سوالات متداول</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="mud-text-secondary mb-8">پاسخ به سوالات رایج راهاندازی و صورتحساب.</MudText>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
|
|
|
|
|
|
<div class="mx-auto max-w-800">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudExpansionPanels Elevation="3" Square="false" Class="mud-elevation-3 rounded-2xl mud-theme-surface">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
@foreach (var q in _faqs)
|
|
|
|
|
|
{
|
|
|
|
|
|
<MudExpansionPanel Text="@q.Q">
|
|
|
|
|
|
<MudText Typo="Typo.body2">@q.A</MudText>
|
|
|
|
|
|
</MudExpansionPanel>
|
|
|
|
|
|
}
|
|
|
|
|
|
</MudExpansionPanels>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- CTA -->
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<section id="contact" class="py-20">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Medium" Class="text-center">
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudPaper Elevation="5" Class="mud-elevation-5 pa-6 rounded-2xl mud-theme-surface">
|
2025-10-07 02:18:07 +03:30
|
|
|
|
<MudText Typo="Typo.h5" Class="mud-typography-subtitle1 mb-2">آمادهٔ راهاندازی هستید؟</MudText>
|
|
|
|
|
|
<MudText Typo="Typo.body1" Class="mud-text-secondary mb-4">ایمیلتان را بگذارید تا دسترسی زودهنگام بگیرید.</MudText>
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudStack Row="true" Spacing="3" Justify="Justify.Center">
|
2025-10-07 00:39:38 +03:30
|
|
|
|
<MudTextField @bind-Value="_email" For="@(() => _email)" Placeholder="you@company.com" Variant="Variant.Outlined" Class="max-w-56" />
|
2025-10-07 02:25:35 +03:30
|
|
|
|
<MudButton Color="Color.Primary" Size="Size.Large" OnClick="@JoinWaitlist">درخواست دسترسی</MudButton>
|
2025-10-07 00:39:38 +03:30
|
|
|
|
</MudStack>
|
|
|
|
|
|
</MudPaper>
|
|
|
|
|
|
</MudContainer>
|
|
|
|
|
|
</section>
|
