add hints to each button

suggesting what kind of input the different queries take

diff --git a/icedeb.css b/icedeb.css
index 37aaf0aacc1ed357ca8c546cdb733a3eed8cec70..80be164c4b70267662bad1b5bdceeb40b9f26c34 100644 (file)
--- a/icedeb.css
+++ b/icedeb.css
@@ -15,7 +15,7 @@ body { padding: 1ex; }
 }
 
 #button-list-container {
-  background: linear-gradient(to bottom, hsl(222,4%,89%) 0%, hsl(0,0%,100%) 100%);
+  background: hsl(222,4%,92%);
   display: flex;
   flex-direction: column;
   padding: 0.1ex;
@@ -23,14 +23,22 @@ body { padding: 1ex; }
 #button-list-container > * {
   margin: 0.5ex;
   padding 0.1ex;
+  display: flex;
 }
 
 .icedeb-button {
   border-radius: 5px;
   cursor: pointer;
   color: blue;
+  margin-right: 1em;
 }
 .icedeb-button:hover {
     text-decoration: underline;
 }
 a, a:visited { color: blue; }
+.hints { margin-left: auto; margin-right: 0; }
+.hints .hint { display: inline-block; width: 1.8ex; text-align: center; margin: 0 0.2ex; cursor: default; }
+.hints .hint.b { background-color: hsl(312,100%,96%) }
+.hints .hint.p { background-color: hsl(120,100%,96%) }
+.hints .hint.m { background-color: hsl(240,100%,96%) }
+.hints .hint.i { background-color: hsl( 40,100%,96%) }

diff --git a/icedeb.html b/icedeb.html
index b68f5a21cf030f3f2ba985e1bed0f4e31311a6a2..fb4b451b64a215b55a765ffb9e6e0f231f4c61e2 100644 (file)
--- a/icedeb.html
+++ b/icedeb.html
@@ -8,13 +8,37 @@
   <textarea id="clip-pot" contenteditable="true"></textarea>
   <input type="text" id="clipboard"/>
   <div id="button-list-container">
-      <div><span class="icedeb-button" id="bts">Bug tracker</span> (<a href="https://bugs.debian.org/">site</a>)</div>
-      <div><span class="icedeb-button" id="pts">Package tracker</span> (<a href="https://tracker.debian.org/">site</a>)</div>
-      <div><span class="icedeb-button" id="deb">Package directory</span> (<a href="https://packages.debian.org/">site</a>)</div>
-      <div><span class="icedeb-button" id="ml">Mailing lists</span> (<a href="https://lists.debian.org/">site</a>)</div>
-      <div><span class="icedeb-button" id="ddpo">Developer overview</span> (<a href="https://qa.debian.org/developer.php">site</a>)</div>
-      <div><span class="icedeb-button" id="dmd">Maintainer dashboard</span> (<a href="https://udd.debian.org/dmd.cgi">site</a>)</div>
-      <div><span class="icedeb-button" id="buildd">Build logs</span> (<a href="https://buildd.debian.org/">site</a>)</div>
-      <div><span class="icedeb-button" id="security">Security tracker</span> (<a href="https://security-tracker.debian.org/">site</a>)</div>
+      <div><span class="icedeb-button" id="bts">Bug tracker</span>
+          <span class="hints"><span class="hint b" title="bug number">b</span><span class="hint p" title="package name">p</span><span class="hint m" title="maintainer email">m</span></span>
+          (<a href="https://bugs.debian.org/">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="pts">Package tracker</span>
+          <span class="hints"><span class="hint p" title="package name">p</span><span class="hint m" title="maintainer email">m</span></span>
+          (<a href="https://tracker.debian.org/">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="deb">Package directory</span>
+          <span class="hints"><span class="hint p" title="package name">p</span></span>
+          (<a href="https://packages.debian.org/">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="ml">Mailing lists</span>
+          <span class="hints"><span class="hint i" title="message ID">i</span></span>
+          (<a href="https://lists.debian.org/">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="ddpo">Developer overview</span>
+          <span class="hints"><span class="hint m" title="maintainer email">m</span></span>
+          (<a href="https://qa.debian.org/developer.php">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="dmd">Maintainer dashboard</span>
+          <span class="hints"><span class="hint m" title="maintainer email">m</span></span>
+          (<a href="https://udd.debian.org/dmd.cgi">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="buildd">Build logs</span>
+          <span class="hints"><span class="hint p" title="package name">p</span></span>
+          (<a href="https://buildd.debian.org/">site</a>)
+      </div>
+      <div><span class="icedeb-button" id="security">Security tracker</span>
+          <span class="hints"><span class="hint p" title="package name">p</span><span class="hint b" title="bug name">b</span></span>
+          (<a href="https://security-tracker.debian.org/">site</a>)
+      </div>
   </div>
 </html>