@viewModel Web.ViewModels.DefaultViewModel, Web
@masterPage Views/Site.dotmaster
<dot:Content ContentPlaceHolderID="Body">
<div DataContext="{value: Wizard}">
<div class="container mt-3" IncludeInPage="{value: NavigationVisible}">
<div class="row">
<div class="col-md-2">
<bs:Button ButtonTagName="button" Click="{command: _root.OnPreviousClick()}" Enabled="{value: PreviousButtonEnabled}" IncludeInPage="{value: PreviousButtonVisible}" Type="Light">
Previous Button
</bs:Button>
</div>
<div class="col-md-8">
<div class="row">
<div class="col-md-3">
Step {{value: Step}} out of {{value: Total}}.
</div>
</div>
<div class="row">
<div class="col-md-12">
<bs:ProgressBar Color="Primary" VisualStyle="AnimatedStriped" Value="{value: Percentage}" />
</div>
</div>
<div class="row">
<div class="col-md-3">
{{value: Percentage.ToString("#.##")}}% Complete
</div>
</div>
</div>
<div class="col-md-2">
<bs:Button ButtonTagName="button" Click="{command: _root.OnNextClick()}" Enabled="{value: NextButtonEnabled}" IncludeInPage="{value: NextButtonVisible}" IsSubmitButton="true" Type="Primary">
Next Button
</bs:Button>
</div>
</div>
</div>
<div class="container mt-3">
<div class="row">
<div class="offset-md-2 col-md-8">
<h5 class="text-muted">{{value: Title}}</h5>
</div>
</div>
</div>
</div>
<div class="container mt-4">
<div class="row">
<div class="col-md-12">
<div IncludeInPage="{value: Wizard.Step == 1}">
<div DataContext="{value: First}">
<bs:Card>
<FooterTemplate>
<footer class="blockquote-footer">Charles Dickens: <cite title="Source Title">A Tale of Two Cities</cite></footer>
</FooterTemplate>
<bs:CardBody>
<blockquote class="blockquote">
<p class="mb-0">
It was the best of times, it was the worst of times, it was the age of
wisdom, it was the age of foolishness, it was the epoch of belief, it was
the epoch of incredulity, it was the season of Light, it was the season of
Darkness, it was the spring of hope, it was the winter of despair, we had
everything before us, we had nothing before us, we were all going direct
to Heaven, we were all going direct the other way—in short, the period
was so far like the present period, that some of its noisiest authorities
insisted on its being received, for good or for evil, in the superlative
degree of comparison only.
</p>
</blockquote>
<bs:CheckBox Checked="{value: IsNextEnabled}" Changed="{command: OnContinueChanged()}" IsInline="true" Text="Continue" />
</bs:CardBody>
</bs:Card>
</div>
</div>
<div IncludeInPage="{value: Wizard.Step == 2}">
<div DataContext="{value: Second}">
<bs:Card>
<FooterTemplate>
<footer class="blockquote-footer">Herman Melville: <cite title="Source Title">Moby Dick</cite></footer>
</FooterTemplate>
<bs:CardBody>
<blockquote class="blockquote">
<p class="mb-0">
Call me Ishmael. Some years ago—never mind how long precisely—having little or
no money in my purse, and nothing particular to interest me on shore, I thought
I would sail about a little and see the watery part of the world. It is a way
I have of driving off the spleen and regulating the circulation. Whenever I
find myself growing grim about the mouth; whenever it is a damp, drizzly
November in my soul; whenever I find myself involuntarily pausing before
coffin warehouses, and bringing up the rear of every funeral I meet; and
especially whenever my hypos get such an upper hand of me, that it requires a
strong moral principle to prevent me from deliberately stepping into the street,
and methodically knocking people’s hats off—then, I account it high time to get
to sea as soon as I can. This is my substitute for pistol and ball. With a
philosophical flourish Cato throws himself upon his sword; I quietly take to the
ship. There is nothing surprising in this. If they but knew it, almost all men
in their degree, some time or other, cherish very nearly the same feelings
towards the ocean with me.
</p>
</blockquote>
<bs:CheckBox Checked="{value: IsNextEnabled}" IsInline="true" Text="Continue" />
</bs:CardBody>
</bs:Card>
</div>
</div>
</div>
</div>
</div>
</dot:Content>