1 files changed, 10 insertions, 2 deletions
diff --git a/index.html b/index.html
index e99d2c6..e12cd3d 100644
--- a/index.html
+++ b/index.html
@@ -4,8 +4,6 @@
 <style>
 body {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: white;
-  text-shadow: 0 0 1px #000;
   transition: background-color 100ms;
   user-select: none;
   overflow: hidden;
@@ -16,17 +14,27 @@ body {
 div {
  	display: inline-block;
 }
+.labels {
+  width: 20px;
+  line-height: 27px;
+}
 </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>
 	<canvas nx="matrix" id="grid"></canvas>
 </div>
 <div>
 	<canvas nx="button" label="shift &uarr;" id="shiftUp"></canvas>
 	<canvas nx="button" label="shift &darr;" id="shiftDown"></canvas>
+	<br>
 	<canvas nx="button" label="slide &uarr;" id="slideUp"></canvas>
 	<canvas nx="button" label="slide &darr;" id="slideDown"></canvas>
+	<canvas nx="button" label="slide &larr;" id="slideLeft"></canvas>
+	<canvas nx="button" label="slide &rarr;" id="slideRight"></canvas>
 	<br>
 	<canvas nx="button" label="rotate &uarr;" id="rotateUp"></canvas>
 	<canvas nx="button" label="rotate &darr;" id="rotateDown"></canvas>