Show the preloaded Anthem sample in the title card
This commit is contained in:
1 parent
da63507cd2
commit
a6a97bc6db
1 file changed
+13
-12
+13
-12
@@ -26,26 +26,27 @@
|
||||
<section id="try">
|
||||
<div class="product-container">
|
||||
<div class="input-section">
|
||||
<input type="text" id="name-input" placeholder="Enter a name..." autocomplete="off">
|
||||
<button id="play-button">Play</button>
|
||||
<input type="text" id="name-input" placeholder="Enter a name..." autocomplete="off" value="Maya Chen" aria-label="Name">
|
||||
<button id="play-button" type="button">Play</button>
|
||||
</div>
|
||||
|
||||
<div class="style-selection">
|
||||
<div class="style-chip active" data-style="chiptune">Chiptune</div>
|
||||
<div class="style-chip" data-style="lo-fi">Lo-Fi</div>
|
||||
<div class="style-chip" data-style="fanfare">Fanfare</div>
|
||||
<div class="style-selection" role="group" aria-label="Style">
|
||||
<button type="button" class="style-chip active" data-style="chiptune" aria-pressed="true">Chiptune</button>
|
||||
<button type="button" class="style-chip" data-style="lo-fi" aria-pressed="false">Lo-Fi</button>
|
||||
<button type="button" class="style-chip" data-style="fanfare" aria-pressed="false">Fanfare</button>
|
||||
</div>
|
||||
|
||||
<div class="title-card">
|
||||
<div class="title-text" id="title-text">Anthem</div>
|
||||
<div class="visualization" id="visualization">
|
||||
<!-- Bars will be generated by JavaScript -->
|
||||
<div class="title-text" id="title-text">Maya Chen</div>
|
||||
<div class="visualization" id="visualization" aria-hidden="true">
|
||||
<!-- Bars are the melody compose() writes for the current name. -->
|
||||
</div>
|
||||
<p class="melody-caption" id="melody-caption">Maya Chen · chiptune · 8 bars</p>
|
||||
</div>
|
||||
|
||||
<div class="controls">
|
||||
<button id="share-button">Share Link</button>
|
||||
<button id="download-button">Download WAV</button>
|
||||
<button id="share-button" type="button">Share Link</button>
|
||||
<a id="download-button" href="#try">Download WAV</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -140,4 +141,4 @@
|
||||
<p>Want the next version? <a href="https://github.com/teahubxyz/time/issues/21" target="_blank" rel="noopener">👍 the signal issue</a></p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Reference in new issue
Block a user