From 0ac8955e5ccad9160e7fcd7212486da1383619d3 Mon Sep 17 00:00:00 2001
From: Marijn Haverbeke <marijnh@gmail.com>
Date: Fri, 26 Jun 2015 12:41:06 +0200
Subject: [PATCH] Change the way the native selection style is overridden by
 themes

So that selection inside widgets isn't affected

Issue #3342
---
 lib/codemirror.css                | 4 ++--
 lib/codemirror.js                 | 4 ++--
 theme/3024-day.css                | 5 +++--
 theme/3024-night.css              | 4 ++--
 theme/ambiance.css                | 4 ++--
 theme/base16-dark.css             | 4 ++--
 theme/base16-light.css            | 4 ++--
 theme/blackboard.css              | 4 ++--
 theme/cobalt.css                  | 4 ++--
 theme/erlang-dark.css             | 4 ++--
 theme/lesser-dark.css             | 4 ++--
 theme/mbo.css                     | 4 ++--
 theme/mdn-like.css                | 4 ++--
 theme/midnight.css                | 4 ++--
 theme/monokai.css                 | 4 ++--
 theme/night.css                   | 4 ++--
 theme/paraiso-dark.css            | 4 ++--
 theme/paraiso-light.css           | 4 ++--
 theme/pastel-on-dark.css          | 4 ++--
 theme/rubyblue.css                | 4 ++--
 theme/solarized.css               | 6 +++---
 theme/the-matrix.css              | 4 ++--
 theme/tomorrow-night-eighties.css | 4 ++--
 theme/twilight.css                | 4 ++--
 theme/vibrant-ink.css             | 4 ++--
 theme/xq-dark.css                 | 4 ++--
 26 files changed, 54 insertions(+), 53 deletions(-)

diff --git a/lib/codemirror.css b/lib/codemirror.css
index 2384ad01f..c4aa3c063 100644
--- a/lib/codemirror.css
+++ b/lib/codemirror.css
@@ -297,8 +297,8 @@ div.CodeMirror-cursors {
 .CodeMirror-selected { background: #d9d9d9; }
 .CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
 .CodeMirror-crosshair { cursor: crosshair; }
-.CodeMirror-line::selection, .CodeMirror-line > span::selection { background: #d7d4f0; }
-.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection { background: #d7d4f0; }
+.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
+.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
 
 .cm-searching {
   background: #ffa;
diff --git a/lib/codemirror.js b/lib/codemirror.js
index a0fce911e..572cbbce5 100644
--- a/lib/codemirror.js
+++ b/lib/codemirror.js
@@ -6790,8 +6790,8 @@
     // The padding-right forces the element to have a 'border', which
     // is needed on Webkit to be able to get line-level bounding
     // rectangles for it (in measureChar).
-    var content = elt("span", null, "CodeMirror-line", webkit ? "padding-right: .1px" : null);
-    var builder = {pre: elt("pre", [content]), content: content,
+    var content = elt("span", null, null, webkit ? "padding-right: .1px" : null);
+    var builder = {pre: elt("pre", [content], "CodeMirror-line"), content: content,
                    col: 0, pos: 0, cm: cm,
                    splitSpaces: (ie || webkit) && cm.getOption("lineWrapping")};
     lineView.measure = {};
diff --git a/theme/3024-day.css b/theme/3024-day.css
index 359281621..1eb109e43 100644
--- a/theme/3024-day.css
+++ b/theme/3024-day.css
@@ -10,8 +10,9 @@
 
 .cm-s-3024-day.CodeMirror {background: #f7f7f7; color: #3a3432;}
 .cm-s-3024-day div.CodeMirror-selected {background: #d6d5d4 !important;}
-.cm-s-3024-day.CodeMirror ::selection { background: #d6d5d4; }
-.cm-s-3024-day.CodeMirror ::-moz-selection { background: #d9d9d9; }
+
+.cm-s-3024-day .CodeMirror-line::selection, .cm-s-3024-day .CodeMirror-line > span::selection, .cm-s-3024-day .CodeMirror-line > span > span::selection { background: #d6d5d4; }
+.cm-s-3024-day .CodeMirror-line::-moz-selection, .cm-s-3024-day .CodeMirror-line > span::-moz-selection, .cm-s-3024-day .CodeMirror-line > span > span::selection { background: #d9d9d9; }
 
 .cm-s-3024-day .CodeMirror-gutters {background: #f7f7f7; border-right: 0px;}
 .cm-s-3024-day .CodeMirror-guttermarker { color: #db2d20; }
diff --git a/theme/3024-night.css b/theme/3024-night.css
index ccab9d50b..36bb8b4ee 100644
--- a/theme/3024-night.css
+++ b/theme/3024-night.css
@@ -10,8 +10,8 @@
 
 .cm-s-3024-night.CodeMirror {background: #090300; color: #d6d5d4;}
 .cm-s-3024-night div.CodeMirror-selected {background: #3a3432 !important;}
-.cm-s-3024-night.CodeMirror ::selection { background: rgba(58, 52, 50, .99); }
-.cm-s-3024-night.CodeMirror ::-moz-selection { background: rgba(58, 52, 50, .99); }
+.cm-s-3024-night .CodeMirror-line::selection, .cm-s-3024-night .CodeMirror-line > span::selection, .cm-s-3024-night .CodeMirror-line > span > span::selection { background: rgba(58, 52, 50, .99); }
+.cm-s-3024-night .CodeMirror-line::-moz-selection, .cm-s-3024-night .CodeMirror-line > span::-moz-selection, .cm-s-3024-night .CodeMirror-line > span > span::-moz-selection { background: rgba(58, 52, 50, .99); }
 .cm-s-3024-night .CodeMirror-gutters {background: #090300; border-right: 0px;}
 .cm-s-3024-night .CodeMirror-guttermarker { color: #db2d20; }
 .cm-s-3024-night .CodeMirror-guttermarker-subtle { color: #5c5855; }
diff --git a/theme/ambiance.css b/theme/ambiance.css
index 3ab9b2548..0e68f75e4 100644
--- a/theme/ambiance.css
+++ b/theme/ambiance.css
@@ -33,8 +33,8 @@
 
 .cm-s-ambiance .CodeMirror-selected { background: rgba(255, 255, 255, 0.15); }
 .cm-s-ambiance.CodeMirror-focused .CodeMirror-selected { background: rgba(255, 255, 255, 0.10); }
-.cm-s-ambiance.CodeMirror ::selection { background: rgba(255, 255, 255, 0.10); }
-.cm-s-ambiance.CodeMirror ::-moz-selection { background: rgba(255, 255, 255, 0.10); }
+.cm-s-ambiance .CodeMirror-line::selection, .cm-s-ambiance .CodeMirror-line > span::selection, .cm-s-ambiance .CodeMirror-line > span > span::selection { background: rgba(255, 255, 255, 0.10); }
+.cm-s-ambiance .CodeMirror-line::-moz-selection, .cm-s-ambiance .CodeMirror-line > span::-moz-selection, .cm-s-ambiance .CodeMirror-line > span > span::-moz-selection { background: rgba(255, 255, 255, 0.10); }
 
 /* Editor styling */
 
diff --git a/theme/base16-dark.css b/theme/base16-dark.css
index b009d2b9d..fb79fae2b 100644
--- a/theme/base16-dark.css
+++ b/theme/base16-dark.css
@@ -10,8 +10,8 @@
 
 .cm-s-base16-dark.CodeMirror {background: #151515; color: #e0e0e0;}
 .cm-s-base16-dark div.CodeMirror-selected {background: #303030 !important;}
-.cm-s-base16-dark.CodeMirror ::selection { background: rgba(48, 48, 48, .99); }
-.cm-s-base16-dark.CodeMirror ::-moz-selection { background: rgba(48, 48, 48, .99); }
+.cm-s-base16-dark .CodeMirror-line::selection, .cm-s-base16-dark .CodeMirror-line > span::selection, .cm-s-base16-dark .CodeMirror-line > span > span::selection { background: rgba(48, 48, 48, .99); }
+.cm-s-base16-dark .CodeMirror-line::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(48, 48, 48, .99); }
 .cm-s-base16-dark .CodeMirror-gutters {background: #151515; border-right: 0px;}
 .cm-s-base16-dark .CodeMirror-guttermarker { color: #ac4142; }
 .cm-s-base16-dark .CodeMirror-guttermarker-subtle { color: #505050; }
diff --git a/theme/base16-light.css b/theme/base16-light.css
index 15df6d380..46508e02c 100644
--- a/theme/base16-light.css
+++ b/theme/base16-light.css
@@ -10,8 +10,8 @@
 
 .cm-s-base16-light.CodeMirror {background: #f5f5f5; color: #202020;}
 .cm-s-base16-light div.CodeMirror-selected {background: #e0e0e0 !important;}
-.cm-s-base16-light.CodeMirror ::selection { background: #e0e0e0; }
-.cm-s-base16-light.CodeMirror ::-moz-selection { background: #e0e0e0; }
+.cm-s-base16-light .CodeMirror-line::selection, .cm-s-base16-light .CodeMirror-line > span::selection, .cm-s-base16-light .CodeMirror-line > span > span::selection { background: #e0e0e0; }
+.cm-s-base16-light .CodeMirror-line::-moz-selection, .cm-s-base16-light .CodeMirror-line > span::-moz-selection, .cm-s-base16-light .CodeMirror-line > span > span::-moz-selection { background: #e0e0e0; }
 .cm-s-base16-light .CodeMirror-gutters {background: #f5f5f5; border-right: 0px;}
 .cm-s-base16-light .CodeMirror-guttermarker { color: #ac4142; }
 .cm-s-base16-light .CodeMirror-guttermarker-subtle { color: #b0b0b0; }
diff --git a/theme/blackboard.css b/theme/blackboard.css
index 02289b630..6de11dd20 100644
--- a/theme/blackboard.css
+++ b/theme/blackboard.css
@@ -2,8 +2,8 @@
 
 .cm-s-blackboard.CodeMirror { background: #0C1021; color: #F8F8F8; }
 .cm-s-blackboard .CodeMirror-selected { background: #253B76 !important; }
-.cm-s-blackboard.CodeMirror ::selection { background: rgba(37, 59, 118, .99); }
-.cm-s-blackboard.CodeMirror ::-moz-selection { background: rgba(37, 59, 118, .99); }
+.cm-s-blackboard .CodeMirror-line::selection, .cm-s-blackboard .CodeMirror-line > span::selection, .cm-s-blackboard .CodeMirror-line > span > span::selection { background: rgba(37, 59, 118, .99); }
+.cm-s-blackboard .CodeMirror-line::-moz-selection, .cm-s-blackboard .CodeMirror-line > span::-moz-selection, .cm-s-blackboard .CodeMirror-line > span > span::-moz-selection { background: rgba(37, 59, 118, .99); }
 .cm-s-blackboard .CodeMirror-gutters { background: #0C1021; border-right: 0; }
 .cm-s-blackboard .CodeMirror-guttermarker { color: #FBDE2D; }
 .cm-s-blackboard .CodeMirror-guttermarker-subtle { color: #888; }
diff --git a/theme/cobalt.css b/theme/cobalt.css
index 391558949..b6eebcfcf 100644
--- a/theme/cobalt.css
+++ b/theme/cobalt.css
@@ -1,7 +1,7 @@
 .cm-s-cobalt.CodeMirror { background: #002240; color: white; }
 .cm-s-cobalt div.CodeMirror-selected { background: #b36539 !important; }
-.cm-s-cobalt.CodeMirror ::selection { background: rgba(179, 101, 57, .99); }
-.cm-s-cobalt.CodeMirror ::-moz-selection { background: rgba(179, 101, 57, .99); }
+.cm-s-cobalt .CodeMirror-line::selection, .cm-s-cobalt .CodeMirror-line > span::selection, .cm-s-cobalt .CodeMirror-line > span > span::selection { background: rgba(179, 101, 57, .99); }
+.cm-s-cobalt .CodeMirror-line::-moz-selection, .cm-s-cobalt .CodeMirror-line > span::-moz-selection, .cm-s-cobalt .CodeMirror-line > span > span::-moz-selection { background: rgba(179, 101, 57, .99); }
 .cm-s-cobalt .CodeMirror-gutters { background: #002240; border-right: 1px solid #aaa; }
 .cm-s-cobalt .CodeMirror-guttermarker { color: #ffee80; }
 .cm-s-cobalt .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
diff --git a/theme/erlang-dark.css b/theme/erlang-dark.css
index e20bf1259..48552f862 100644
--- a/theme/erlang-dark.css
+++ b/theme/erlang-dark.css
@@ -1,7 +1,7 @@
 .cm-s-erlang-dark.CodeMirror { background: #002240; color: white; }
 .cm-s-erlang-dark div.CodeMirror-selected { background: #b36539 !important; }
-.cm-s-erlang-dark.CodeMirror ::selection { background: rgba(179, 101, 57, .99); }
-.cm-s-erlang-dark.CodeMirror ::-moz-selection { background: rgba(179, 101, 57, .99); }
+.cm-s-erlang-dark .CodeMirror-line::selection, .cm-s-erlang-dark .CodeMirror-line > span::selection, .cm-s-erlang-dark .CodeMirror-line > span > span::selection { background: rgba(179, 101, 57, .99); }
+.cm-s-erlang-dark .CodeMirror-line::-moz-selection, .cm-s-erlang-dark .CodeMirror-line > span::-moz-selection, .cm-s-erlang-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(179, 101, 57, .99); }
 .cm-s-erlang-dark .CodeMirror-gutters { background: #002240; border-right: 1px solid #aaa; }
 .cm-s-erlang-dark .CodeMirror-guttermarker { color: white; }
 .cm-s-erlang-dark .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
diff --git a/theme/lesser-dark.css b/theme/lesser-dark.css
index 88dff9219..0573c0669 100644
--- a/theme/lesser-dark.css
+++ b/theme/lesser-dark.css
@@ -7,8 +7,8 @@ Ported to CodeMirror by Peter Kroon
 }
 .cm-s-lesser-dark.CodeMirror { background: #262626; color: #EBEFE7; text-shadow: 0 -1px 1px #262626; }
 .cm-s-lesser-dark div.CodeMirror-selected {background: #45443B !important;} /* 33322B*/
-.cm-s-lesser-dark.CodeMirror ::selection { background: rgba(69, 68, 59, .99); }
-.cm-s-lesser-dark.CodeMirror ::-moz-selection { background: rgba(69, 68, 59, .99); }
+.cm-s-lesser-dark .CodeMirror-line::selection, .cm-s-lesser-dark .CodeMirror-line > span::selection, .cm-s-lesser-dark .CodeMirror-line > span > span::selection { background: rgba(69, 68, 59, .99); }
+.cm-s-lesser-dark .CodeMirror-line::-moz-selection, .cm-s-lesser-dark .CodeMirror-line > span::-moz-selection, .cm-s-lesser-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(69, 68, 59, .99); }
 .cm-s-lesser-dark .CodeMirror-cursor { border-left: 1px solid white !important; }
 .cm-s-lesser-dark pre { padding: 0 8px; }/*editable code holder*/
 
diff --git a/theme/mbo.css b/theme/mbo.css
index e39879522..cc9032e0e 100644
--- a/theme/mbo.css
+++ b/theme/mbo.css
@@ -6,8 +6,8 @@
 
 .cm-s-mbo.CodeMirror {background: #2c2c2c; color: #ffffec;}
 .cm-s-mbo div.CodeMirror-selected {background: #716C62 !important;}
-.cm-s-mbo.CodeMirror ::selection { background: rgba(113, 108, 98, .99); }
-.cm-s-mbo.CodeMirror ::-moz-selection { background: rgba(113, 108, 98, .99); }
+.cm-s-mbo .CodeMirror-line::selection, .cm-s-mbo .CodeMirror-line > span::selection, .cm-s-mbo .CodeMirror-line > span > span::selection { background: rgba(113, 108, 98, .99); }
+.cm-s-mbo .CodeMirror-line::-moz-selection, .cm-s-mbo .CodeMirror-line > span::-moz-selection, .cm-s-mbo .CodeMirror-line > span > span::-moz-selection { background: rgba(113, 108, 98, .99); }
 .cm-s-mbo .CodeMirror-gutters {background: #4e4e4e; border-right: 0px;}
 .cm-s-mbo .CodeMirror-guttermarker { color: white; }
 .cm-s-mbo .CodeMirror-guttermarker-subtle { color: grey; }
diff --git a/theme/mdn-like.css b/theme/mdn-like.css
index 9c73dc2f0..771d4471e 100644
--- a/theme/mdn-like.css
+++ b/theme/mdn-like.css
@@ -9,8 +9,8 @@
 */
 .cm-s-mdn-like.CodeMirror { color: #999; background-color: #fff; }
 .cm-s-mdn-like .CodeMirror-selected { background: #cfc !important; }
-.cm-s-mdn-like.CodeMirror ::selection { background: #cfc; }
-.cm-s-mdn-like.CodeMirror ::-moz-selection { background: #cfc; }
+.cm-s-mdn-like .CodeMirror-line::selection, .cm-s-mdn-like .CodeMirror-line > span::selection, .cm-s-mdn-like .CodeMirror-line > span > span::selection { background: #cfc; }
+.cm-s-mdn-like .CodeMirror-line::-moz-selection, .cm-s-mdn-like .CodeMirror-line > span::-moz-selection, .cm-s-mdn-like .CodeMirror-line > span > span::-moz-selection { background: #cfc; }
 
 .cm-s-mdn-like .CodeMirror-gutters { background: #f8f8f8; border-left: 6px solid rgba(0,83,159,0.65); color: #333; }
 .cm-s-mdn-like .CodeMirror-linenumber { color: #aaa; padding-left: 8px; }
diff --git a/theme/midnight.css b/theme/midnight.css
index 296af4f7d..9e9825b3f 100644
--- a/theme/midnight.css
+++ b/theme/midnight.css
@@ -15,8 +15,8 @@
 .cm-s-midnight.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
 
 .cm-s-midnight div.CodeMirror-selected {background: #314D67 !important;}
-.cm-s-midnight.CodeMirror ::selection { background: rgba(49, 77, 103, .99); }
-.cm-s-midnight.CodeMirror ::-moz-selection { background: rgba(49, 77, 103, .99); }
+.cm-s-midnight .CodeMirror-line::selection, .cm-s-midnight .CodeMirror-line > span::selection, .cm-s-midnight .CodeMirror-line > span > span::selection { background: rgba(49, 77, 103, .99); }
+.cm-s-midnight .CodeMirror-line::-moz-selection, .cm-s-midnight .CodeMirror-line > span::-moz-selection, .cm-s-midnight .CodeMirror-line > span > span::-moz-selection { background: rgba(49, 77, 103, .99); }
 .cm-s-midnight .CodeMirror-gutters {background: #0F192A; border-right: 1px solid;}
 .cm-s-midnight .CodeMirror-guttermarker { color: white; }
 .cm-s-midnight .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
diff --git a/theme/monokai.css b/theme/monokai.css
index cea775f67..e11e80cac 100644
--- a/theme/monokai.css
+++ b/theme/monokai.css
@@ -2,8 +2,8 @@
 
 .cm-s-monokai.CodeMirror {background: #272822; color: #f8f8f2;}
 .cm-s-monokai div.CodeMirror-selected {background: #49483E !important;}
-.cm-s-monokai.CodeMirror ::selection { background: rgba(73, 72, 62, .99); }
-.cm-s-monokai.CodeMirror ::-moz-selection { background: rgba(73, 72, 62, .99); }
+.cm-s-monokai .CodeMirror-line::selection, .cm-s-monokai .CodeMirror-line > span::selection, .cm-s-monokai .CodeMirror-line > span > span::selection { background: rgba(73, 72, 62, .99); }
+.cm-s-monokai .CodeMirror-line::-moz-selection, .cm-s-monokai .CodeMirror-line > span::-moz-selection, .cm-s-monokai .CodeMirror-line > span > span::-moz-selection { background: rgba(73, 72, 62, .99); }
 .cm-s-monokai .CodeMirror-gutters {background: #272822; border-right: 0px;}
 .cm-s-monokai .CodeMirror-guttermarker { color: white; }
 .cm-s-monokai .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
diff --git a/theme/night.css b/theme/night.css
index 6b2ac6c7c..6fbbcaa20 100644
--- a/theme/night.css
+++ b/theme/night.css
@@ -2,8 +2,8 @@
 
 .cm-s-night.CodeMirror { background: #0a001f; color: #f8f8f8; }
 .cm-s-night div.CodeMirror-selected { background: #447 !important; }
-.cm-s-night.CodeMirror ::selection { background: rgba(68, 68, 119, .99); }
-.cm-s-night.CodeMirror ::-moz-selection { background: rgba(68, 68, 119, .99); }
+.cm-s-night .CodeMirror-line::selection, .cm-s-night .CodeMirror-line > span::selection, .cm-s-night .CodeMirror-line > span > span::selection { background: rgba(68, 68, 119, .99); }
+.cm-s-night .CodeMirror-line::-moz-selection, .cm-s-night .CodeMirror-line > span::-moz-selection, .cm-s-night .CodeMirror-line > span > span::-moz-selection { background: rgba(68, 68, 119, .99); }
 .cm-s-night .CodeMirror-gutters { background: #0a001f; border-right: 1px solid #aaa; }
 .cm-s-night .CodeMirror-guttermarker { color: white; }
 .cm-s-night .CodeMirror-guttermarker-subtle { color: #bbb; }
diff --git a/theme/paraiso-dark.css b/theme/paraiso-dark.css
index af914b60b..2b6a797d0 100644
--- a/theme/paraiso-dark.css
+++ b/theme/paraiso-dark.css
@@ -10,8 +10,8 @@
 
 .cm-s-paraiso-dark.CodeMirror {background: #2f1e2e; color: #b9b6b0;}
 .cm-s-paraiso-dark div.CodeMirror-selected {background: #41323f !important;}
-.cm-s-paraiso-dark.CodeMirror ::selection { background: rgba(65, 50, 63, .99); }
-.cm-s-paraiso-dark.CodeMirror ::-moz-selection { background: rgba(65, 50, 63, .99); }
+.cm-s-paraiso-dark .CodeMirror-line::selection, .cm-s-paraiso-dark .CodeMirror-line > span::selection, .cm-s-paraiso-dark .CodeMirror-line > span > span::selection { background: rgba(65, 50, 63, .99); }
+.cm-s-paraiso-dark .CodeMirror-line::-moz-selection, .cm-s-paraiso-dark .CodeMirror-line > span::-moz-selection, .cm-s-paraiso-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(65, 50, 63, .99); }
 .cm-s-paraiso-dark .CodeMirror-gutters {background: #2f1e2e; border-right: 0px;}
 .cm-s-paraiso-dark .CodeMirror-guttermarker { color: #ef6155; }
 .cm-s-paraiso-dark .CodeMirror-guttermarker-subtle { color: #776e71; }
diff --git a/theme/paraiso-light.css b/theme/paraiso-light.css
index e198066fa..01d2e11f5 100644
--- a/theme/paraiso-light.css
+++ b/theme/paraiso-light.css
@@ -10,8 +10,8 @@
 
 .cm-s-paraiso-light.CodeMirror {background: #e7e9db; color: #41323f;}
 .cm-s-paraiso-light div.CodeMirror-selected {background: #b9b6b0 !important;}
-.cm-s-paraiso-light.CodeMirror ::selection { background: #b9b6b0; }
-.cm-s-paraiso-light.CodeMirror ::-moz-selection { background: #b9b6b0; }
+.cm-s-paraiso-light .CodeMirror-line::selection, .cm-s-paraiso-light .CodeMirror-line > span::selection, .cm-s-paraiso-light .CodeMirror-line > span > span::selection { background: #b9b6b0; }
+.cm-s-paraiso-light .CodeMirror-line::-moz-selection, .cm-s-paraiso-light .CodeMirror-line > span::-moz-selection, .cm-s-paraiso-light .CodeMirror-line > span > span::-moz-selection { background: #b9b6b0; }
 .cm-s-paraiso-light .CodeMirror-gutters {background: #e7e9db; border-right: 0px;}
 .cm-s-paraiso-light .CodeMirror-guttermarker { color: black; }
 .cm-s-paraiso-light .CodeMirror-guttermarker-subtle { color: #8d8687; }
diff --git a/theme/pastel-on-dark.css b/theme/pastel-on-dark.css
index 0d06f6328..1c7f84c45 100644
--- a/theme/pastel-on-dark.css
+++ b/theme/pastel-on-dark.css
@@ -14,8 +14,8 @@
 	font-size: 14px;
 }
 .cm-s-pastel-on-dark div.CodeMirror-selected { background: rgba(221,240,255,0.2) !important; }
-.cm-s-pastel-on-dark.CodeMirror ::selection { background: rgba(221,240,255,0.2); }
-.cm-s-pastel-on-dark.CodeMirror ::-moz-selection { background: rgba(221,240,255,0.2); }
+.cm-s-pastel-on-dark .CodeMirror-line::selection, .cm-s-pastel-on-dark .CodeMirror-line > span::selection, .cm-s-pastel-on-dark .CodeMirror-line > span > span::selection { background: rgba(221,240,255,0.2); }
+.cm-s-pastel-on-dark .CodeMirror-line::-moz-selection, .cm-s-pastel-on-dark .CodeMirror-line > span::-moz-selection, .cm-s-pastel-on-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(221,240,255,0.2); }
 
 .cm-s-pastel-on-dark .CodeMirror-gutters {
 	background: #34302f;
diff --git a/theme/rubyblue.css b/theme/rubyblue.css
index d2fc0ecdb..064f192f7 100644
--- a/theme/rubyblue.css
+++ b/theme/rubyblue.css
@@ -1,7 +1,7 @@
 .cm-s-rubyblue.CodeMirror { background: #112435; color: white; }
 .cm-s-rubyblue div.CodeMirror-selected { background: #38566F !important; }
-.cm-s-rubyblue.CodeMirror ::selection { background: rgba(56, 86, 111, 0.99); }
-.cm-s-rubyblue.CodeMirror ::-moz-selection { background: rgba(56, 86, 111, 0.99); }
+.cm-s-rubyblue .CodeMirror-line::selection, .cm-s-rubyblue .CodeMirror-line > span::selection, .cm-s-rubyblue .CodeMirror-line > span > span::selection { background: rgba(56, 86, 111, 0.99); }
+.cm-s-rubyblue .CodeMirror-line::-moz-selection, .cm-s-rubyblue .CodeMirror-line > span::-moz-selection, .cm-s-rubyblue .CodeMirror-line > span > span::-moz-selection { background: rgba(56, 86, 111, 0.99); }
 .cm-s-rubyblue .CodeMirror-gutters { background: #1F4661; border-right: 7px solid #3E7087; }
 .cm-s-rubyblue .CodeMirror-guttermarker { color: white; }
 .cm-s-rubyblue .CodeMirror-guttermarker-subtle { color: #3E7087; }
diff --git a/theme/solarized.css b/theme/solarized.css
index 1f1dedac1..03ace472d 100644
--- a/theme/solarized.css
+++ b/theme/solarized.css
@@ -96,11 +96,11 @@ http://ethanschoonover.com/solarized/img/solarized-palette.png
 
 .cm-s-solarized.cm-s-dark .CodeMirror-selected { background: #073642; }
 .cm-s-solarized.cm-s-dark.CodeMirror ::selection { background: rgba(7, 54, 66, 0.99); }
-.cm-s-solarized.cm-s-dark.CodeMirror ::-moz-selection { background: rgba(7, 54, 66, 0.99); }
+.cm-s-solarized.cm-s-dark .CodeMirror-line::-moz-selection, .cm-s-dark .CodeMirror-line > span::-moz-selection, .cm-s-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(7, 54, 66, 0.99); }
 
 .cm-s-solarized.cm-s-light .CodeMirror-selected { background: #eee8d5; }
-.cm-s-solarized.cm-s-light.CodeMirror ::selection { background: #eee8d5; }
-.cm-s-solarized.cm-s-lightCodeMirror ::-moz-selection { background: #eee8d5; }
+.cm-s-solarized.cm-s-light .CodeMirror-line::selection, .cm-s-light .CodeMirror-line > span::selection, .cm-s-light .CodeMirror-line > span > span::selection { background: #eee8d5; }
+.cm-s-solarized.cm-s-ligh .CodeMirror-line::-moz-selection, .cm-s-ligh .CodeMirror-line > span::-moz-selection, .cm-s-ligh .CodeMirror-line > span > span::-moz-selection { background: #eee8d5; }
 
 /* Editor styling */
 
diff --git a/theme/the-matrix.css b/theme/the-matrix.css
index f29b22b0d..ec6046ad9 100644
--- a/theme/the-matrix.css
+++ b/theme/the-matrix.css
@@ -1,7 +1,7 @@
 .cm-s-the-matrix.CodeMirror { background: #000000; color: #00FF00; }
 .cm-s-the-matrix div.CodeMirror-selected { background: #2D2D2D !important; }
-.cm-s-the-matrix.CodeMirror ::selection { background: rgba(45, 45, 45, 0.99); }
-.cm-s-the-matrix.CodeMirror ::-moz-selection { background: rgba(45, 45, 45, 0.99); }
+.cm-s-the-matrix .CodeMirror-line::selection, .cm-s-the-matrix .CodeMirror-line > span::selection, .cm-s-the-matrix .CodeMirror-line > span > span::selection { background: rgba(45, 45, 45, 0.99); }
+.cm-s-the-matrix .CodeMirror-line::-moz-selection, .cm-s-the-matrix .CodeMirror-line > span::-moz-selection, .cm-s-the-matrix .CodeMirror-line > span > span::-moz-selection { background: rgba(45, 45, 45, 0.99); }
 .cm-s-the-matrix .CodeMirror-gutters { background: #060; border-right: 2px solid #00FF00; }
 .cm-s-the-matrix .CodeMirror-guttermarker { color: #0f0; }
 .cm-s-the-matrix .CodeMirror-guttermarker-subtle { color: white; }
diff --git a/theme/tomorrow-night-eighties.css b/theme/tomorrow-night-eighties.css
index 5fca3cafb..a8ee8f5d9 100644
--- a/theme/tomorrow-night-eighties.css
+++ b/theme/tomorrow-night-eighties.css
@@ -10,8 +10,8 @@
 
 .cm-s-tomorrow-night-eighties.CodeMirror {background: #000000; color: #CCCCCC;}
 .cm-s-tomorrow-night-eighties div.CodeMirror-selected {background: #2D2D2D !important;}
-.cm-s-tomorrow-night-eighties.CodeMirror ::selection { background: rgba(45, 45, 45, 0.99); }
-.cm-s-tomorrow-night-eighties.CodeMirror ::-moz-selection { background: rgba(45, 45, 45, 0.99); }
+.cm-s-tomorrow-night-eighties .CodeMirror-line::selection, .cm-s-tomorrow-night-eighties .CodeMirror-line > span::selection, .cm-s-tomorrow-night-eighties .CodeMirror-line > span > span::selection { background: rgba(45, 45, 45, 0.99); }
+.cm-s-tomorrow-night-eighties .CodeMirror-line::-moz-selection, .cm-s-tomorrow-night-eighties .CodeMirror-line > span::-moz-selection, .cm-s-tomorrow-night-eighties .CodeMirror-line > span > span::-moz-selection { background: rgba(45, 45, 45, 0.99); }
 .cm-s-tomorrow-night-eighties .CodeMirror-gutters {background: #000000; border-right: 0px;}
 .cm-s-tomorrow-night-eighties .CodeMirror-guttermarker { color: #f2777a; }
 .cm-s-tomorrow-night-eighties .CodeMirror-guttermarker-subtle { color: #777; }
diff --git a/theme/twilight.css b/theme/twilight.css
index 889a83d79..360d44afc 100644
--- a/theme/twilight.css
+++ b/theme/twilight.css
@@ -1,7 +1,7 @@
 .cm-s-twilight.CodeMirror { background: #141414; color: #f7f7f7; } /**/
 .cm-s-twilight .CodeMirror-selected { background: #323232 !important; } /**/
-.cm-s-twilight.CodeMirror ::selection { background: rgba(50, 50, 50, 0.99); }
-.cm-s-twilight.CodeMirror ::-moz-selection { background: rgba(50, 50, 50, 0.99); }
+.cm-s-twilight .CodeMirror-line::selection, .cm-s-twilight .CodeMirror-line > span::selection, .cm-s-twilight .CodeMirror-line > span > span::selection { background: rgba(50, 50, 50, 0.99); }
+.cm-s-twilight .CodeMirror-line::-moz-selection, .cm-s-twilight .CodeMirror-line > span::-moz-selection, .cm-s-twilight .CodeMirror-line > span > span::-moz-selection { background: rgba(50, 50, 50, 0.99); }
 
 .cm-s-twilight .CodeMirror-gutters { background: #222; border-right: 1px solid #aaa; }
 .cm-s-twilight .CodeMirror-guttermarker { color: white; }
diff --git a/theme/vibrant-ink.css b/theme/vibrant-ink.css
index 8ea535973..8d3e99d38 100644
--- a/theme/vibrant-ink.css
+++ b/theme/vibrant-ink.css
@@ -2,8 +2,8 @@
 
 .cm-s-vibrant-ink.CodeMirror { background: black; color: white; }
 .cm-s-vibrant-ink .CodeMirror-selected { background: #35493c !important; }
-.cm-s-vibrant-ink.CodeMirror ::selection { background: rgba(53, 73, 60, 0.99); }
-.cm-s-vibrant-ink.CodeMirror ::-moz-selection { background: rgba(53, 73, 60, 0.99); }
+.cm-s-vibrant-ink .CodeMirror-line::selection, .cm-s-vibrant-ink .CodeMirror-line > span::selection, .cm-s-vibrant-ink .CodeMirror-line > span > span::selection { background: rgba(53, 73, 60, 0.99); }
+.cm-s-vibrant-ink .CodeMirror-line::-moz-selection, .cm-s-vibrant-ink .CodeMirror-line > span::-moz-selection, .cm-s-vibrant-ink .CodeMirror-line > span > span::-moz-selection { background: rgba(53, 73, 60, 0.99); }
 
 .cm-s-vibrant-ink .CodeMirror-gutters { background: #002240; border-right: 1px solid #aaa; }
 .cm-s-vibrant-ink .CodeMirror-guttermarker { color: white; }
diff --git a/theme/xq-dark.css b/theme/xq-dark.css
index d537993e8..5cdfe8f03 100644
--- a/theme/xq-dark.css
+++ b/theme/xq-dark.css
@@ -22,8 +22,8 @@ THE SOFTWARE.
 */
 .cm-s-xq-dark.CodeMirror { background: #0a001f; color: #f8f8f8; }
 .cm-s-xq-dark .CodeMirror-selected { background: #27007A !important; }
-.cm-s-xq-dark.CodeMirror ::selection { background: rgba(39, 0, 122, 0.99); }
-.cm-s-xq-dark.CodeMirror ::-moz-selection { background: rgba(39, 0, 122, 0.99); }
+.cm-s-xq-dark .CodeMirror-line::selection, .cm-s-xq-dark .CodeMirror-line > span::selection, .cm-s-xq-dark .CodeMirror-line > span > span::selection { background: rgba(39, 0, 122, 0.99); }
+.cm-s-xq-dark .CodeMirror-line::-moz-selection, .cm-s-xq-dark .CodeMirror-line > span::-moz-selection, .cm-s-xq-dark .CodeMirror-line > span > span::-moz-selection { background: rgba(39, 0, 122, 0.99); }
 .cm-s-xq-dark .CodeMirror-gutters { background: #0a001f; border-right: 1px solid #aaa; }
 .cm-s-xq-dark .CodeMirror-guttermarker { color: #FFBD40; }
 .cm-s-xq-dark .CodeMirror-guttermarker-subtle { color: #f8f8f8; }
-- 
GitLab