From 76ead4dfc5eb7fec547bf90e6dc50ff768aa6eb2 Mon Sep 17 00:00:00 2001
From: Wesley Aptekar-Cassels <me@wesleyac.com>
Date: Sun, 12 Jul 2020 18:51:41 -0400
Subject: [PATCH] Improve styling on selected links

This commit makes several improvements to selected links:

* Previously, the link selection style had both the -moz prefixed
  selector and the unprefixed selector in the same rule, breaking the
  rule for browsers that did not know about the -moz prefix (such as
  Chrome). This is fixed by removing the -moz prefixed version, since it
  is not needed on modern browsers.
* Previously, the background color was set to #b4d5fe, but this is not
  the correct selection color for all platforms. This is fixed by using
  the "highlight" and "highlighttext" colors, to ensure that link
  selections look the same as the surrounding text.
* Selection fixes are now applied to markup in links, as well as text in
  links - for instance, italicised or bolded links will look normal now.

This has been tested in Firefox and Chrome on Linux, and offers
improvements on both (bringing it from nonfunctional on Chrome to
functional but inconsistent with the operating system style, and from
functional but inconsistent on Firefox to fully functional).

The reason that Chrome does not respect the system highlight style
appears to be either a bug or an intentional choice - the rule is
getting correctly applied, but Chrome has the incorrect definition for
the "highlight" color.
---
 latex.css | 8 +++-----
 tufte.css | 7 ++++---
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/latex.css b/latex.css
index 2db66ef..d41b3a7 100644
--- a/latex.css
+++ b/latex.css
@@ -11,8 +11,6 @@
              margin-right: -0.15rem;
              text-shadow: none; }
 
-.latex::selection, .latex span:not(.latex-sup)::selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe;
-                    background: #b4d5fe; }
-
-.latex::-moz-selection, .latex span:not(.latex-sup)::-moz-selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe;
-                         background: #b4d5fe; }
+.latex::selection, .latex span:not(.latex-sup)::selection { text-shadow: 0.03em 0 highlight, -0.03em 0 highlight, 0 0.03em highlight, 0 -0.03em highlight, 0.06em 0 highlight, -0.06em 0 highlight, 0.09em 0 highlight, -0.09em 0 highlight, 0.12em 0 highlight, -0.12em 0 highlight, 0.15em 0 highlight, -0.15em 0 highlight;
+                    background: highlight;
+                    color: highlighttext; }
diff --git a/tufte.css b/tufte.css
index 976bbd9..02c775f 100644
--- a/tufte.css
+++ b/tufte.css
@@ -249,9 +249,10 @@ a:link, .tufte-underline, .hover-tufte-underline:hover {
 }
 
 a:link::selection,
-a:link::-moz-selection {
-    text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe;
-    background: #b4d5fe;
+a:link ::selection {
+    text-shadow: 0.03em 0 highlight, -0.03em 0 highlight, 0 0.03em highlight, 0 -0.03em highlight, 0.06em 0 highlight, -0.06em 0 highlight, 0.09em 0 highlight, -0.09em 0 highlight, 0.12em 0 highlight, -0.12em 0 highlight, 0.15em 0 highlight, -0.15em 0 highlight;
+    background-color: highlight;
+    color: highlighttext;
 }
 
 /* Sidenotes, margin notes, figures, captions */