{{ define "title" }}Welcome{{ end }}

{{ define "content" }}
    <div class="container">
        <table class="table table-striped table-bordered table-hover">
            <caption>Allowance totals for our children</caption>
            </thead>
                <tr class="info">
                    <td>
                        Name
                    </td>
                    <td>
                        Amount
                    </td>
                </tr>
            </thead>
            <tbody>
                {{ range .children }}
                <tr>
                    <td class="name">
                        {{ .Name }}
                    </td>
                    <td>
                        {{ dollarize .Money }}
                    </td>
                </tr>
                <tr class="controls">
                    <td colspan=2>
                        <div class="btn-group">
                            <button class="btn" value=100>$1.00</button>
                            <button class="btn" value=25>25&cent;</button>
                            <button class="btn" value=10>10&cent;</button>
                            <button class="btn" value=5>5&cent;</button>
                        </div>
                    </td>
                </tr>
                {{ end }}
            </tbody>
        </table>
    </div>
{{ end }}

{{ define "script" }}
    <script>
        $(function() {
            $(".controls").hide();
            $(".name").click(function(e) {
                console.log(e)
            });
        });
    </script>
{{ end }}