index.chtml

@using EPiServer.Web.Routing
@model Montana.Backend.Models.ViewModels.CampaignLandingPageViewModel

@if (Model != null)
{
    <img class="header-img" src="@UrlResolver.Current.GetUrl(Model.CurrentPage.Hero)" />
    <div class="header-txt">
        <br />
        <h1>Bla bla</h1>
        <br />
        <p>Bl blsa bal balbaoif dohvis dfiuhsfi sifdhsi fisidfgysdgfygs uygfuys e</p>
        <br />
    </div>
    @Html.PropertyFor(m => m.CurrentPage.TeaserText)
    <form class="beoplay-form">
        <div class="radio-btns-container">
            @foreach (var kvp in Model.NameAndImageDictionary)
            {
                //both radio buttons cannot be with the same name, otherwise the user will be able to click both
                <input class="beoplay-radio" type="radio" id="@kvp.Key" name="beoplay-stereo" value="@kvp.Key" />
                <label for="@kvp.Key"><img class="form-img" src="@kvp.Value" /></label>
            }
        </div>
        <p class="form-txt">
            Lorem ipsum lorem ipsum lorem ipsum lorem ipsum
        </p>
        <div class="form-inputs">
            <div class="beoplay-pageId">
                <input class="input-field" name="pageId" type="hidden" value="@Model.CurrentPage.ContentLink" />
            </div>
            <div class="beoplay-name">
                <input class="input-field" name="name" type="text" placeholder="@Model.CurrentPage.ClientNameLabel" />
            </div>
            <div class="beoplay-address">
                <input class="input-field" name="adress" type="text" placeholder="@Model.CurrentPage.AdressLabel" />
            </div>
            <div class="beoplay-city">
                <input class="input-field" name="city" type="text" placeholder="@Model.CurrentPage.CityLabel" />
            </div>
            <div class="beoplay-country">
                <input class="input-field" name="country" type="text" placeholder="@Model.CurrentPage.CountryLabel" />
            </div>
            <div class="beoplay-phone">
                <input class="input-field" name="phone" type="tel" placeholder="@Model.CurrentPage.PhoneLabel" />
            </div>
            <div class="beoplay-email">
                <input class="input-field" name="email" type="email" placeholder="@Model.CurrentPage.EmailLabel" />
            </div>
            <div class="form-newsletter-txt">
                <p>Yes, I want to receive newsletters</p>
            </div>
            <div>
                <label for="montanaNewsletter">@Model.CurrentPage.NewsLetterLabel</label>
                <input id="montanaNewsletter" class="beoplay-newsletter" name="newsletter" type="checkbox" />
            </div>
            @if (Model.CurrentPage.SignupForPartnerNewsletter)
    {
        <label for="partnerNewsletter">@Model.CurrentPage.PartnerNewsletter</label>
        <input id="partnerNewsletter" class="beoplay-partner" name="partnerNewsletter" type="checkbox" />
}
            <submit>@Model.CurrentPage.SubmitText</submit>
            <div class="submit-btn-wrapper">
                <a href="#" title="@Model.CurrentPage.SubmitText" class="submitSignup submit-btn">@Model.CurrentPage.SubmitText</a>
            </div>
        </div>
</form>
}