55 lines
1.6 KiB
Plaintext
55 lines
1.6 KiB
Plaintext
@model OnboardingJourneyHeaderViewModel
|
|
@{
|
|
var steps = BuildDefaultSteps();
|
|
var totalSteps = Math.Max(Model.TotalSteps, steps.Count);
|
|
var currentStep = Math.Clamp(Model.CurrentStep, 1, totalSteps);
|
|
var progressWidth = totalSteps <= 1
|
|
? 100
|
|
: ((currentStep - 1) * 100) / (totalSteps - 1);
|
|
}
|
|
|
|
<div class="onboarding-progress" aria-label="@Model.AriaLabel">
|
|
<span>Step @currentStep of @totalSteps</span>
|
|
<div class="onboarding-progress-track">
|
|
<span style="width:@progressWidth%"></span>
|
|
</div>
|
|
</div>
|
|
<ol class="onboarding-stepper" style="--onboarding-step-count:@steps.Count" aria-label="Manuscript import journey">
|
|
@foreach (var step in steps)
|
|
{
|
|
<li class="@StepClass(step.Order, currentStep)">
|
|
<span>@step.Order</span>
|
|
<strong>@step.Label</strong>
|
|
</li>
|
|
}
|
|
</ol>
|
|
|
|
@functions {
|
|
private sealed record HeaderStep(string Label, int Order);
|
|
|
|
private static IReadOnlyList<HeaderStep> BuildDefaultSteps() =>
|
|
[
|
|
new("Welcome", 1),
|
|
new("Writing Stage", 2),
|
|
new("Writing Software", 3),
|
|
new("Project", 4),
|
|
new("Book", 5),
|
|
new("Connect Word", 6),
|
|
new("Review Chapters", 7),
|
|
new("Review Characters", 8),
|
|
new("Story Summary", 9),
|
|
new("Story Context", 10),
|
|
new("Complete", 11)
|
|
];
|
|
|
|
private static string StepClass(int order, int currentStep)
|
|
{
|
|
if (order < currentStep)
|
|
{
|
|
return "is-complete";
|
|
}
|
|
|
|
return order == currentStep ? "is-current" : "is-upcoming";
|
|
}
|
|
}
|