comparison dottes.html.learnertune @ 619:2fe68733ec17 build-default-248

Fix learner tune CSS. Broken during tune page CSS revision. Give the main display its own CSS.
author Jim Hague <jim.hague@acm.org>
date Sun, 06 Nov 2016 08:24:22 +0000
parents afc031477784
children dfeb781e5196
comparison
equal deleted inserted replaced
618:11e5862beaa8 619:2fe68733ec17
29 </div> 29 </div>
30 30
31 <div class="grid_12 dottes-body"> 31 <div class="grid_12 dottes-body">
32 <div class="dottes-tune-display"> 32 <div class="dottes-tune-display">
33 <div class="dottes-tune-header"> 33 <div class="dottes-tune-header">
34 <div class="dottes-tune-header-icons-column"></div>
35 <div class="dottes-tune-header-title-column"></div>
36 <div class="dottes-tune-header-composer-column"></div>
34 <div class="dottes-tune-header-row"> 37 <div class="dottes-tune-header-row">
35 <div class="dottes-tune-header-left"> 38 <div class="dottes-tune-header-icons">
36 <a class="dottes-tune-icon-link" href="${name}.html"> 39 <a class="dottes-tune-icon-link" href="${name}.html">
37 <img class="dottes-tune-table-image" src="../img/music.png" 40 <img class="dottes-tune-table-image" src="../img/music.png"
38 alt="Dottes"> 41 alt="Dottes">
39 </a> 42 </a>
40 <a class="dottes-tune-icon-link" href="index.html"> 43 <a class="dottes-tune-icon-link" href="index.html">
41 <img class="dottes-tune-table-image" src="../img/book.png" 44 <img class="dottes-tune-table-image" src="../img/book.png"
42 alt="Tune index"> 45 alt="Tune index">
43 </a> 46 </a>
44 </div> 47 </div>
45 <div class="dottes-tune-header-middle"> 48 <div class="dottes-tune-header-title">
46 <h1>${title}</h1> 49 <h1>${title}</h1>
47 <h2>${subtitle}</h2> 50 <h2>${subtitle}</h2>
48 </div> 51 </div>
49 <div class="dottes-tune-header-right"> 52 <div class="dottes-tune-header-composer">
50 <em>${composer}</em> 53 <em>${composer}</em>
51 </div> 54 </div>
52 </div> 55 </div>
53 </div> 56 </div>
54 <p>${title} is in the key of ${key}. 57 <p>${title} is in the key of ${key}.
55 <div class="dottes-tune-footer"> 58 <div class="dottes-tune-learner">
56 <div class="dottes-tune-footer-row"> 59 <div class="dottes-tune-learner-speed-column"></div>
57 <div class="dottes-tune-footer-left"> 60 <div class="dottes-tune-learner-play-column"></div>
61 <div class="dottes-tune-learner-download-column"></div>
62 <div class="dottes-tune-learner-row">
63 <div class="dottes-tune-learner-speed">
58 <p>Normal speed 64 <p>Normal speed
59 </div> 65 </div>
60 <div class="dottes-tune-footer-centre"> 66 <div class="dottes-tune-learner-play">
61 <audio controls loop> 67 <audio controls loop>
62 <source src="../${masterbooke}/normal-${name}.mp3" type="audio/mpeg" /> 68 <source src="../${masterbooke}/normal-${name}.mp3" type="audio/mpeg" />
63 <source src="../${masterbooke}/normal-${name}.ogg" type="audio/ogg" /> 69 <source src="../${masterbooke}/normal-${name}.ogg" type="audio/ogg" />
64 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> 70 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
65 <param name="FileName" value="normal-${name}.mp3" /> 71 <param name="FileName" value="normal-${name}.mp3" />
72 <param name="playCount" value="100000" /> 78 <param name="playCount" value="100000" />
73 </object> 79 </object>
74 </object> 80 </object>
75 </audio> 81 </audio>
76 </div> 82 </div>
77 <div class="dottes-tune-footer-right"> 83 <div class="dottes-tune-learner-download">
78 <ul class="tune-data-list"> 84 <ul class="tune-data-list">
79 <li><a class="dottes-link-tune dottes-mp3" download 85 <li><a class="dottes-link-tune dottes-mp3" download
80 href="../${masterbooke}/${name}.mp3">MP3</a></li> 86 href="../${masterbooke}/${name}.mp3">MP3</a></li>
81 <li><a class="dottes-link-tune dottes-ogg" download 87 <li><a class="dottes-link-tune dottes-ogg" download
82 href="../${masterbooke}/${name}.ogg">OGG</a></li> 88 href="../${masterbooke}/${name}.ogg">OGG</a></li>
83 </ul> 89 </ul>
84 </div> 90 </div>
85 </div> 91 </div>
86 <div class="dottes-tune-footer-row"> 92 <div class="dottes-tune-learner-row">
87 <div class="dottes-tune-footer-left"> 93 <div class="dottes-tune-learner-speed">
88 <p>Slightly slower 94 <p>Slightly slower
89 </div> 95 </div>
90 <div class="dottes-tune-footer-centre"> 96 <div class="dottes-tune-learner-play">
91 <audio controls loop> 97 <audio controls loop>
92 <source src="../${masterbooke}/littleslow-${name}.mp3" type="audio/mpeg" /> 98 <source src="../${masterbooke}/littleslow-${name}.mp3" type="audio/mpeg" />
93 <source src="../${masterbooke}/littleslow-${name}.ogg" type="audio/ogg" /> 99 <source src="../${masterbooke}/littleslow-${name}.ogg" type="audio/ogg" />
94 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> 100 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
95 <param name="FileName" value="littleslow-${name}.mp3" /> 101 <param name="FileName" value="littleslow-${name}.mp3" />
102 <param name="playCount" value="100000" /> 108 <param name="playCount" value="100000" />
103 </object> 109 </object>
104 </object> 110 </object>
105 </audio> 111 </audio>
106 </div> 112 </div>
107 <div class="dottes-tune-footer-right"> 113 <div class="dottes-tune-learner-download">
108 <ul class="tune-data-list"> 114 <ul class="tune-data-list">
109 <li><a class="dottes-link-tune dottes-mp3" download 115 <li><a class="dottes-link-tune dottes-mp3" download
110 href="../${masterbooke}/littleslow-${name}.mp3">MP3</a></li> 116 href="../${masterbooke}/littleslow-${name}.mp3">MP3</a></li>
111 <li><a class="dottes-link-tune dottes-ogg" download 117 <li><a class="dottes-link-tune dottes-ogg" download
112 href="../${masterbooke}/littleslow-${name}.ogg">OGG</a></li> 118 href="../${masterbooke}/littleslow-${name}.ogg">OGG</a></li>
113 </ul> 119 </ul>
114 </div> 120 </div>
115 </div> 121 </div>
116 <div class="dottes-tune-footer-row"> 122 <div class="dottes-tune-learner-row">
117 <div class="dottes-tune-footer-left"> 123 <div class="dottes-tune-learner-speed">
118 <p>Slow 124 <p>Slow
119 </div> 125 </div>
120 <div class="dottes-tune-footer-centre"> 126 <div class="dottes-tune-learner-play">
121 <audio controls loop> 127 <audio controls loop>
122 <source src="../${masterbooke}/slow-${name}.mp3" type="audio/mpeg" /> 128 <source src="../${masterbooke}/slow-${name}.mp3" type="audio/mpeg" />
123 <source src="../${masterbooke}/slow-${name}.ogg" type="audio/ogg" /> 129 <source src="../${masterbooke}/slow-${name}.ogg" type="audio/ogg" />
124 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> 130 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
125 <param name="FileName" value="slow-${name}.mp3" /> 131 <param name="FileName" value="slow-${name}.mp3" />
132 <param name="playCount" value="100000" /> 138 <param name="playCount" value="100000" />
133 </object> 139 </object>
134 </object> 140 </object>
135 </audio> 141 </audio>
136 </div> 142 </div>
137 <div class="dottes-tune-footer-right"> 143 <div class="dottes-tune-learner-download">
138 <ul class="tune-data-list"> 144 <ul class="tune-data-list">
139 <li><a class="dottes-link-tune dottes-mp3" download 145 <li><a class="dottes-link-tune dottes-mp3" download
140 href="../${masterbooke}/slow-${name}.mp3">MP3</a></li> 146 href="../${masterbooke}/slow-${name}.mp3">MP3</a></li>
141 <li><a class="dottes-link-tune dottes-ogg" download 147 <li><a class="dottes-link-tune dottes-ogg" download
142 href="../${masterbooke}/slow-${name}.ogg">OGG</a></li> 148 href="../${masterbooke}/slow-${name}.ogg">OGG</a></li>
143 </ul> 149 </ul>
144 </div> 150 </div>
145 </div> 151 </div>
146 <div class="dottes-tune-footer-row"> 152 <div class="dottes-tune-learner-row">
147 <div class="dottes-tune-footer-left"> 153 <div class="dottes-tune-learner-speed">
148 <p>Very slow 154 <p>Very slow
149 </div> 155 </div>
150 <div class="dottes-tune-footer-centre"> 156 <div class="dottes-tune-learner-play">
151 <audio controls loop> 157 <audio controls loop>
152 <source src="../${masterbooke}/veryslow-${name}.mp3" type="audio/mpeg" /> 158 <source src="../${masterbooke}/veryslow-${name}.mp3" type="audio/mpeg" />
153 <source src="../${masterbooke}/veryslow-${name}.ogg" type="audio/ogg" /> 159 <source src="../${masterbooke}/veryslow-${name}.ogg" type="audio/ogg" />
154 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> 160 <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
155 <param name="FileName" value="veryslow-${name}.mp3" /> 161 <param name="FileName" value="veryslow-${name}.mp3" />
162 <param name="playCount" value="100000" /> 168 <param name="playCount" value="100000" />
163 </object> 169 </object>
164 </object> 170 </object>
165 </audio> 171 </audio>
166 </div> 172 </div>
167 <div class="dottes-tune-footer-right"> 173 <div class="dottes-tune-learner-download">
168 <ul class="tune-data-list"> 174 <ul class="tune-data-list">
169 <li><a class="dottes-link-tune dottes-mp3" download 175 <li><a class="dottes-link-tune dottes-mp3" download
170 href="../${masterbooke}/veryslow-${name}.mp3">MP3</a></li> 176 href="../${masterbooke}/veryslow-${name}.mp3">MP3</a></li>
171 <li><a class="dottes-link-tune dottes-ogg" download 177 <li><a class="dottes-link-tune dottes-ogg" download
172 href="../${masterbooke}/veryslow-${name}.ogg">OGG</a></li> 178 href="../${masterbooke}/veryslow-${name}.ogg">OGG</a></li>