diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 34 |
1 files changed, 28 insertions, 6 deletions
@@ -4,6 +4,7 @@ <style> body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 13px; transition: background-color 100ms; user-select: none; overflow: hidden; @@ -14,20 +15,39 @@ body { div { display: inline-block; } -.labels { - width: 20px; - line-height: 27px; +#labels { + width: 11px; + line-height: 27px; + position: relative; + top: -3px; +} +#scale_list { + margin-left: 20px; +} +#scale_list div { + display: block; + cursor: pointer; +} +#scale_list .selected { + font-weight: bold; } </style> </head> <body> <div> - <div class='labels'> - 1 2 3 4 5 6 7 1 2 3 4 5 6 7 1 2 3 4 5 6 7 1 2 3 - </div> + <div id='labels'></div> <canvas nx="matrix" id="grid"></canvas> </div> <div> + <canvas nx="number" label="tempo" id="tempo"></canvas> + <br> + <br><br><br> + <br><br><br> + <br><br><br> + <br><br><br> + <br><br><br> + <br><br><br> + <br><br><br> <canvas nx="button" label="shift ↑" id="shiftUp"></canvas> <canvas nx="button" label="shift ↓" id="shiftDown"></canvas> <br> @@ -43,6 +63,8 @@ div { <canvas nx="button" label="flip ↕" id="flip"></canvas> <canvas nx="button" label="flop ↔" id="flop"></canvas> </div> +<br> +<div id='scale_list'></div> </body> <script> var s = document.createElement('script'); |