From 444e274202f08be166c57b9a779410db390197a8 Mon Sep 17 00:00:00 2001
From: RunasSudo <runassudo@yingtongli.me>
Date: Wed, 23 Jun 2021 20:18:53 +1000
Subject: [PATCH] Show help text on hover for pills

---
 html/index.html | 8 ++++----
 html/main.css   | 3 +++
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/html/index.html b/html/index.html
index 50ab513..44c2475 100644
--- a/html/index.html
+++ b/html/index.html
@@ -117,7 +117,7 @@
 						</label>
 						<label>
 							<input type="checkbox" id="chkMeekNZExclusion">
-							<span class="pill-grey">Meek</span>
+							<span class="pill-grey" title="This option has effect only if “Method” is set to “Meek method”">Meek</span>
 							NZ-style exclusion
 						</label>
 					</div>
@@ -161,7 +161,7 @@
 							</select>
 						</label>
 						<label>
-							<span class="pill-grey">Fixed</span>
+							<span class="pill-grey" title="This option has effect only if “Numbers” is set to “Fixed” or “Fixed (guarded)”">Fixed</span>
 							Decimal places:
 							<input type="number" id="txtDP" value="5" min="0" style="width: 3em;">
 						</label>
@@ -192,7 +192,7 @@
 					</label>
 					<label class="col-6">
 						<input type="checkbox" id="chkMeekImmediateElect">
-						<span class="pill-grey">Meek</span>
+						<span class="pill-grey" title="This option has effect only if “Method” is set to “Meek method”">Meek</span>
 						Immediate election
 					</label>
 					<div class="col-12 subheading">
@@ -247,7 +247,7 @@
 						</select>
 					</label>
 					<label class="col-12">
-						<span class="pill-grey">Meek</span>
+						<span class="pill-grey" title="This option has effect only if “Method” is set to “Meek method”">Meek</span>
 						Surplus tolerance:
 						<input type="text" id="txtMeekSurplusTolerance" value="0.001%" style="width: 5em;">
 					</label>
diff --git a/html/main.css b/html/main.css
index 9eb1a87..13ffc72 100644
--- a/html/main.css
+++ b/html/main.css
@@ -57,6 +57,9 @@ a:hover {
 	font-weight: 600;
 	padding: 0 0.5em;
 }
+.pill-grey[title] {
+	cursor: help;
+}
 
 .cols-12 {
 	display: grid;