From 45c8b61f2c55a4534e7069c1febc36bf5709fccd Mon Sep 17 00:00:00 2001
From: Brian Cully <bjc@spork.org>
Date: Sun, 9 Mar 2025 15:33:40 -0400
Subject: css: show note interval underneath note

---
 main.css | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

(limited to 'main.css')

diff --git a/main.css b/main.css
index 975bbef..77b282a 100644
--- a/main.css
+++ b/main.css
@@ -45,8 +45,25 @@ body {
 
 #key-picker .notes {
     padding-left: 0;
+    list-style-position: outside;
+    display: grid;
+    grid-template-rows: 2;
+    grid-template-columns: 2em 2em 2em 2em 2em 2em 2em;
+    counter-reset: notes;
+}
+
+#key-picker .notes li:before {
+    display: grid;
+    grid-row-start: 2;
+    content: counter(notes, numeric);
+    color: grey;
+    font-size: small;
+    text-align: center;
 }
 
 #key-picker .notes li {
-    display: inline;
+    display: grid;
+    grid-row-start: 1;
+    counter-increment: notes;
+    text-align: center;
 }
-- 
cgit v1.2.3