Mercurial > dottes

diff dottes.html.tune @ 724:be87f9a027f1

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Move book and learner tune link to centre of bottom row, and add popup text. The parts display is not uncomplicated by the images, and they have explanations - at least some users I've spoken to did not understand what they do.
author Jim Hague <jim.hague@acm.org>
date Wed, 11 Oct 2017 16:18:13 +0100
parents f8ab14cc9d8d
children 833e6185b6a2
line wrap: on
line diff
--- a/dottes.html.tune	Tue Oct 10 16:18:39 2017 +0100
+++ b/dottes.html.tune	Wed Oct 11 16:18:13 2017 +0100
@@ -13,27 +13,19 @@
   <div class="container">
     <a href="/">
       <div class="header-strip banner">
-        <img src="../img/banner.png">
+        <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-icons-column"></div>
+          <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-icons">
+            <div class="dottes-tune-header-parts">
               <p>
-                <a class="dottes-tune-icon-link" href="learner-${name}.html">
-                  <img class="dottes-tune-header-image" src="../img/learner.png"
-                       alt="Learner">
-                </a>
-                <a class="dottes-tune-icon-link" href="index.html">
-                  <img class="dottes-tune-header-image" src="../img/book.png"
-                       alt="Tune index">
-                </a>
                 ${parts}
               </p>
             </div>
@@ -90,6 +82,14 @@
               <a href="${prevpage}">${prevtitle}</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 ${title}">
+                </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}">${nexttitle}</a>