feat(05-02): add live preview panel HTML and CSS styles
- Add #live-preview div between timeline-canvas and block-inspector - Add show selector (show-select + btn-load-show) to transport bar - Add keyboard-hint span at far right of transport bar - Append .live-preview, .device-strip, .strip-label, .strip-color, .strip-anim, .keyboard-hint CSS styles
This commit is contained in:
@@ -65,6 +65,7 @@
|
||||
<button id="btn-snap" class="transport-btn snap-btn active" title="Snap to beat">SNAP</button>
|
||||
</div>
|
||||
<canvas id="timeline-canvas"></canvas>
|
||||
<div id="live-preview" class="live-preview" style="display:none;"></div>
|
||||
<div id="block-inspector" class="block-inspector" style="display:none;"></div>
|
||||
</main>
|
||||
|
||||
@@ -81,6 +82,13 @@
|
||||
|
||||
<div class="transport-sep"></div>
|
||||
|
||||
<select id="show-select" class="transport-file-select">
|
||||
<option value="">— no shows —</option>
|
||||
</select>
|
||||
<button id="btn-load-show" class="transport-btn" title="Load saved show">LOAD</button>
|
||||
|
||||
<div class="transport-sep"></div>
|
||||
|
||||
<label class="transport-btn" title="Upload MP3/WAV/FLAC/OGG" style="cursor:pointer;">
|
||||
+ UPLOAD
|
||||
<input type="file" id="audio-upload" accept=".mp3,.wav,.flac,.ogg" style="display:none;">
|
||||
@@ -91,6 +99,9 @@
|
||||
</select>
|
||||
|
||||
<button id="btn-load" class="transport-btn" title="Load selected file">LOAD</button>
|
||||
|
||||
<div style="flex:1"></div>
|
||||
<span class="keyboard-hint">[SPACE] PLAY [←→] SEEK [^Z] UNDO [^S] SAVE</span>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user