Introduces comprehensive user authentication flow with plan selection and registration Includes: - Pricing page with plan details and selection - Payment page with plan summary and card information - Signup page for different plan tiers - Shared authentication layout and design system improvements Enhances user onboarding experience with clear plan information and streamlined signup process
83 lines
2.9 KiB
Text
83 lines
2.9 KiB
Text
@page "/pricing"
|
|
@model PlanTempus.Application.Features.Accounts.Pages.PricingModel
|
|
@{
|
|
ViewData["Title"] = "Vælg abonnement";
|
|
Layout = "/Features/_Shared/Pages/_AuthLayout.cshtml";
|
|
}
|
|
|
|
<swp-pricing-page>
|
|
<swp-pricing-header>
|
|
<swp-auth-logo>
|
|
<i class="ph ph-calendar-check"></i>
|
|
<span>PlanTempus</span>
|
|
</swp-auth-logo>
|
|
|
|
<swp-pricing-title>Vælg dit abonnement</swp-pricing-title>
|
|
<swp-pricing-subtitle>Start med 14 dages gratis prøveperiode. Ingen binding.</swp-pricing-subtitle>
|
|
</swp-pricing-header>
|
|
|
|
<swp-pricing-grid>
|
|
@foreach (var plan in Model.Plans)
|
|
{
|
|
var cardClass = plan.Key switch
|
|
{
|
|
"pro" => "popular",
|
|
"enterprise" => "enterprise",
|
|
_ => ""
|
|
};
|
|
|
|
var actionUrl = plan.RequiresPayment
|
|
? $"/payment?plan={plan.Key}"
|
|
: $"/signup?plan={plan.Key}";
|
|
|
|
var buttonText = plan.Key switch
|
|
{
|
|
"basis" => "Kom i gang gratis",
|
|
"enterprise" => "Kontakt salg",
|
|
_ => $"Vælg {plan.Name}"
|
|
};
|
|
|
|
var buttonClass = plan.IsContactSales ? "outline" : "primary";
|
|
|
|
<swp-plan-card class="@cardClass">
|
|
<swp-plan-badge class="@plan.BadgeClass">
|
|
<i class="ph @plan.BadgeIcon"></i>
|
|
@plan.BadgeText
|
|
</swp-plan-badge>
|
|
<swp-plan-name>@plan.Name</swp-plan-name>
|
|
<swp-plan-users>@plan.UserRange</swp-plan-users>
|
|
<swp-plan-price>
|
|
@if (plan.PricePerMonth.HasValue)
|
|
{
|
|
<swp-plan-price-amount>@plan.PriceDisplay</swp-plan-price-amount>
|
|
<swp-plan-price-period>kr/md</swp-plan-price-period>
|
|
}
|
|
else
|
|
{
|
|
<swp-plan-price-amount class="contact">Kontakt os</swp-plan-price-amount>
|
|
}
|
|
</swp-plan-price>
|
|
<swp-plan-features>
|
|
@foreach (var feature in plan.Features)
|
|
{
|
|
<swp-plan-feature>
|
|
<i class="ph ph-check-circle"></i>
|
|
@feature
|
|
</swp-plan-feature>
|
|
}
|
|
</swp-plan-features>
|
|
<swp-plan-action>
|
|
<a href="@actionUrl" class="swp-btn @buttonClass full-width">
|
|
@buttonText
|
|
</a>
|
|
</swp-plan-action>
|
|
</swp-plan-card>
|
|
}
|
|
</swp-pricing-grid>
|
|
|
|
<swp-pricing-footer>
|
|
<swp-pricing-footer-text>
|
|
Har du allerede en konto? <a href="/login">Log ind</a>
|
|
</swp-pricing-footer-text>
|
|
</swp-pricing-footer>
|
|
</swp-pricing-page>
|