<!--
  Copyright 2020 The Go Authors. All rights reserved.
  Use of this source code is governed by a BSD-style
  license that can be found in the LICENSE file.
-->

{{define "pre_content"}}
  <link href="/static/css/unit.css?version={{.AppVersionLabel}}" rel="stylesheet">
  {{block "unit_pre_content" .}}{{end}}
  <link href="/static/css/unit_outline.css?version={{.AppVersionLabel}}" rel="stylesheet">
{{end}}

{{define "main_content"}}
  <div class="Container">
    {{block "unit_header" .}}{{end}}
    {{block "unit_content" .}}{{end}}
  </div>

  <dialog class="JumpDialog Dialog">
    <h2 class="Dialog-title">Jump to</h2>
    <form method="dialog">
      <div class="JumpDialog-filter">
        <input class="JumpDialog-input" autocomplete="off" type="text">
      </div>
      <div class="JumpDialog-body">
        <div class="JumpDialog-list"></div>
      </div>
      <div class="Dialog-actions">
        <button class="Dialog-button">Close</button>
      </div>
    </form>
  </dialog>

  <dialog class="ShortcutsDialog Dialog">
    <h2 class="Dialog-title">Keyboard shortcuts</h2>
    <table>
      <tbody>
        <tr><td class="ShortcutsDialog-key"><b>?</b></td><td> : This menu</td></tr>
        <tr><td class="ShortcutsDialog-key"><b>/</b></td><td> : Search site</td></tr>
        <tr><td class="ShortcutsDialog-key"><b>f</b> or <b>F</b></td><td> : Jump to</td></tr>
      </tbody>
    </table>
    <form method="dialog">
      <div class="Dialog-actions">
        <button class="Dialog-button">Close</button>
      </div>
    </form>
  </dialog>
{{end}}

{{define "post_content"}}
  <div class="js-canonicalURLPath" data-canonical-url-path="{{.CanonicalURLPath}}" hidden />
  <script>
    loadScript('/static/js/keyboard.js', {type: 'module', async: true, defer: true})
    loadScript('/static/js/unit.js', {type: 'module', async: true, defer: true})
  </script>
  {{block "unit_post_content" .}}{{end}}
{{end}}