html

gistfile1.html

<@controller class="APPLICATION\sites\pres\documentcontroller\sfw\verein\kunstrasen_controller" @>
<htmlheader:addtitle>Erneuerung des Kunstrasens &ndash; Sportfreunde Winterbach e.V.</htmlheader:addtitle>

<style>
    .sportplatz {
        background-image: url('/APPLICATION/media/files/sfw/sonstige/platz.jpg');
        background-size: cover;
    }

    td {
        border: 0;
        margin: 0;
        padding: 3px !important;
    }

    ul.legend {
        background-color: aliceblue;
        border: 1px dashed darkgrey;
        padding: 5px 25px;
    }

    ul.legend li {
        font: 12px Verdana, sans-serif;
    }

    .quadrat {
        margin-top: 4px;
        width: 13px;
        height: 13px;
        background-color: black;
    }

    .orange {
        background-color: orangered;
    }

    .green {
        background-color: forestgreen;
    }

    .blue {
        background-color: dodgerblue;
    }

    .red {
        background-color: red;
    }


</style>

<div class="row">
    <div class="col-md-12">
        <h1>Sportfreunde Winterbach e.V.</h1>
    </div>

    <div class="col-md-6">
        <p>Hallo! Wir, die Sportfreunde Winterbach, wollen im Sommer 2018 mit der Erneuerung unseres
            Kunstrasenplatzes
            beginnen.</p>
        <p>Für eine solche Mammutaufgabe sind wir auf die Spendenbereitschaft unserer Mitglieder und Sponsoren
            angewiesen.</p>
        <p>
            So können kleine Felder bereits zu einem Betrag von 10 € gekauft werden, größere Sonderflächen stehen zu
            gesonderten Konditionen bereit.
            In der Legende unterhalb des folgenden Platzabbildes sind diese Sonderflächen aufgelistet.<br/>
            Bei Interesse wendet euch / wenden Sie sich bitte an die E-Mail Adresse
            <a target="_blank" href="mailto: [email protected]">[email protected]</a>.
        </p>
        <p>Wir bedanken uns bereits vorab bei allen Spendern.</p>
    </div>
    <div class="col-md-6">
        <h3><b>Legende:</b></h3>
        <ul class="legend">
            <li>Feld wurde bereits erworben bzw, ist reserviert.</li>
            <li>Felder des Sechzehmeterraumes, k&ouml;nnen nur zusammen erworben werden.</li>
            <li>Felder des Mittelkreises, k&ouml;nnen nur zusammen erworben werden.</li>
            <li>Felder des F&uuml;nfmeterraumes, k&ouml;nnen nur zusammen erworben werden.</li>
            <li>Felder der Torlinie, k&ouml;nnen nur zusammen erworben werden.</li>
            <li>Eckfelder, k&ouml;nnen nur zusammen erworben werden.</li>
        </ul>
    </div>

    ${form}

</div>


<html:form name="form" id="form" method="POST">

    <div class="col-md-12" style="margin-bottom: 30px;">
        <div class="table-responsive">
            <table class="table table-sm sportplatz">
                ${content}
            </table>
        </div>
    </div>

    <div class="col-md-6">
        <div class="form-group row">
            <label for="name" class="col-sm-2 col-form-label">Name</label>
            <div class="col-sm-10">
                <form:text class="form-control" id="name" name="name" placeholder="Name"/>
            </div>
        </div>
        <div class="form-group row">
            <label for="phone" class="col-sm-2 col-form-label">Telefon</label>
            <div class="col-sm-10">
                <form:text class="form-control" id="phone" name="phone" placeholder="Telefon"/>
            </div>
        </div>
        <div class="form-group row">
            <label for="email" class="col-sm-2 col-form-label">E-Mail</label>
            <div class="col-sm-10">
                <form:text class="form-control" name="email" id="email" placeholder="E-Mail"/>
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group row">
            <label for="address" class="col-sm-2 col-form-label">Adresse</label>
            <div class="col-sm-10">
                <form:area class="form-control" id="address" name="address" placeholder="Adresse"></form:area>
            </div>
        </div>
        <div class="form-group row">
            <label for="annotation" class="col-sm-2 col-form-label">Anmerkung</label>
            <div class="col-sm-10">
                <form:area class="form-control" id="annotation" name="annotation"
                           placeholder="Anmerkung"></form:area>
            </div>
        </div>
    </div>

    <div class="col-md-12">
        <div class="form-check">
            <label class="form-check-label">
                <form:checkbox class="form-check-input" name="receipt"/>
                Ich ben&ouml;tige eine Spendenquittung
            </label>
        </div>
    </div>

    <div class="col-md-12 text-right" style="margin-bottom: 30px;">
        <button type="submit" class="btn btn-primary">Bestellung abgeben!</button>
    </div>
</html:form>