Mercurial > dottes

view dottes.html.tune @ 872:7377575957b0

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Add text to Battle of the Somme, and we now need a compact version.
author Jim Hague <jim.hague@acm.org>
date Tue, 26 Mar 2019 13:51:30 +0000
parents 3ba2e11466cd
children d6e2a281cceb
line wrap: on
line source

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Cry Havoc tunes - ${title}</title>
  <link rel="stylesheet" href="../css/dottes.css" />

  <link href='http://fonts.googleapis.com/css?family=Pirata+One|Open+Sans'
        rel='stylesheet' type='text/css'>
</head>
<body>
  <div class="container">
    <a href="/">
      <div class="header-strip banner">
        <img src="../img/banner.png" alt="Havoc banner image">
      </div>
    </a>

    <div class="dottes-body">
      <div class="dottes-tune-display">
        <div class="dottes-tune-header">
          <div class="dottes-tune-header-parts-column"></div>
          <div class="dottes-tune-header-title-column"></div>
          <div class="dottes-tune-header-composer-column"></div>
          <div class="dottes-tune-header-row">
            <div class="dottes-tune-header-parts">
              <p>
                ${parts}
              </p>
            </div>
            <div class="dottes-tune-header-title">
              <h1>${title}</h1>
              <h2>${subtitle}</h2>
            </div>
            <div class="dottes-tune-header-composer">
              <em>${composer}</em>
            </div>
          </div>
        </div>
        <img class="dottes-png" src="${name}.png" alt="${title} dots">
        <div class="dottes-notes-${notesvisibility}">
          ${notes}
        </div>
        <div class="dottes-history-${historyvisibility}">
          ${history}
        </div>
        <div class="dottes-tune-footer">
          <div class="dottes-tune-footer-links-column"></div>
          <div class="dottes-tune-footer-play-column"></div>
          <div class="dottes-tune-footer-last-column"></div>
          <div class="dottes-tune-footer-row">
            <div class="dottes-tune-footer-links">
              <ul class="tune-data-list">
                <li><a class="dottes-link-tune dottes-pdf" download
                       href="${name}.pdf">PDF</a></li>
                <li><a class="dottes-link-tune dottes-midi" download
                       href="../${masterbooke}/${name}.mid">MIDI</a></li>
                <li><a class="dottes-link-tune dottes-mp3" download
                       href="../${masterbooke}/${name}.mp3">MP3</a></li>
                <li><a class="dottes-link-tune dottes-ogg" download
                       href="../${masterbooke}/${name}.ogg">OGG</a></li>
                <li><a class="dottes-link-tune dottes-abc" download
                       href="${name}.abc">ABC</a></li>
                <li><a class="dottes-link-tune dottes-xml" download
                       href="${name}.xml">XML</a></li>
              </ul>
            </div>
            <div class="dottes-tune-footer-play">
              <audio controls>
                <source src="../${masterbooke}/${name}.mp3" type="audio/mpeg" />
                <source src="../${masterbooke}/${name}.ogg" type="audio/ogg" />
              </audio>
            </div>
            <div class="dottes-tune-footer-last">
              Last changed ${lastchanged}
            </div>
          </div>
          <div class="dottes-tune-footer-row">
            <div class="dottes-tune-footer-prev">
              <a href="${prevpage}">${prevfulltitle}</a>
            </div>
            <div class="dottes-tune-footer-booke">
                <a class="dottes-tune-icon-link" href="learner-${name}.html">
                  <img class="dottes-tune-header-image" src="../img/learner.png"
                       alt="Learner tune page" title="Go to learner page for ${fulltitle}">
                </a>
                <a class="dottes-tune-icon-link" href="index.html">
                  <img class="dottes-tune-header-image" src="../img/book.png"
                       alt="Tune booke index" title="Go to tune booke index">
                </a>
            </div>
            <div class="dottes-tune-footer-next">
              <a href="${nextpage}">${nextfulltitle}</a>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
</body>
</html>