{{ define "main" }}
<div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-4 sidebar">
            <h1 class="post-title fw-semibold">&larr;<a href="{{.Page.FirstSection.RelPermalink}}">{{.Page.FirstSection.Title}}</a></h1>
            {{if .Page.CurrentSection.Pages}}
            <h2 class="fw-semibold">Остальное</h2>
            <ul>
                {{ range .Page.CurrentSection.Pages }}
                <li>
                    <a href="{{ .RelPermalink }}">{{ .Title }}</a>
                </li>
                {{ end }}
            </ul>
            {{ end }}
        </div>
        <div class="col-xs-12 col-sm-12 col-md-8 content">
            <div class="post">
                {{ partial "single/header.html" . }}
                    <div id="pico-container">
                        <!-- <div class="buttons">
                            <button
                                id="pico-up"
                                style="grid-area: up"
                                onclick="PicoPress(3, 0)"
                            >
                                &uArr;
                            </button>
                            <button
                                id="pico-down"
                                style="grid-area: down"
                                onclick="PicoPress(3, 0)"
                            >
                                &dArr;
                            </button>
                            <button
                                id="pico-left"
                                style="grid-area: left"
                                onclick="PicoPress(3, 0)"
                            >
                                &lArr;
                            </button>
                            <button
                                id="pico-right"
                                style="grid-area: right"
                                onclick="PicoPress(3, 0)"
                            >
                                &rArr;
                            </button>
                            <button
                                id="pico-a"
                                style="grid-area: a"
                                onclick="PicoPress(3, 0)"
                            >
                                A
                            </button>
                            <button
                                id="pico-b"
                                style="grid-area: b"
                                onclick="PicoPress(3, 0)"
                            >
                                B
                            </button>
                            <div class="square_hack"></div>
                        </div> -->
                    </div>
                    <h2>Управление</h2>
                    <h3>Игрок 1</h3>
                    <img src="/img/p8_lf.webp" />&larr;&nbsp;
                    <img src="/img/p8_rt.webp" />&rarr;&nbsp;
                    <img src="/img/p8_up.webp" />&uarr;&nbsp;
                    <img src="/img/p8_dw.webp" />&darr;&nbsp;
                    <img src="/img/p8_x.webp" />Z C&nbsp;
                    <img src="/img/p8_o.webp" />X V&nbsp;
                    <h3>Игрок 2</h3>
                    <img src="/img/p8_lf.webp" /> S&nbsp;
                    <img src="/img/p8_rt.webp" /> F&nbsp;
                    <img src="/img/p8_up.webp" /> E&nbsp;
                    <img src="/img/p8_dw.webp" /> D&nbsp;
                    <img src="/img/p8_x.webp" />Q W&nbsp;
                    <img src="/img/p8_o.webp" />TAB&nbsp;
                    <h3>Пауза</h3>
                    P/Enter
                    <footer>
                        <div class="row between-xs">
                            <a href="{{ .Params.Game }}">Скачать</a>
                        </div>
                    </footer>
                    {{ partial "single/footer.html" . }}
                </div>
            </div>
          </div>
    </div>
</div>

<script src="/js/picoplayer.js"></script>
<script src="/js/pico8.js"></script>

<script>
    document.addEventListener("DOMContentLoaded", function (event) {
        PicoPlayer("pico-container", "{{.Params.Game}}");
    });
</script>
{{ end }}