From e3748a29e86d6bcfea21e726319b770ef1a38ecb Mon Sep 17 00:00:00 2001
From: Marijn Haverbeke <marijnh@gmail.com>
Date: Wed, 3 Dec 2014 16:40:48 +0100
Subject: [PATCH] Style in-editor selections to match default selection style
So that the contenteditable input style doesn't look silly
on desktop.
---
lib/codemirror.css | 2 ++
theme/3024-day.css | 2 ++
theme/3024-night.css | 2 ++
theme/ambiance.css | 10 ++++------
theme/base16-dark.css | 2 ++
theme/base16-light.css | 2 ++
theme/blackboard.css | 2 ++
theme/cobalt.css | 2 ++
theme/erlang-dark.css | 2 ++
theme/lesser-dark.css | 2 ++
theme/mbo.css | 2 ++
theme/mdn-like.css | 2 ++
theme/midnight.css | 2 ++
theme/monokai.css | 2 ++
theme/night.css | 2 ++
theme/paraiso-dark.css | 2 ++
theme/paraiso-light.css | 2 ++
theme/pastel-on-dark.css | 3 +++
theme/rubyblue.css | 2 ++
theme/solarized.css | 12 ++++++------
theme/the-matrix.css | 2 ++
theme/tomorrow-night-eighties.css | 2 ++
theme/twilight.css | 2 ++
theme/vibrant-ink.css | 2 ++
theme/xq-dark.css | 2 ++
25 files changed, 57 insertions(+), 12 deletions(-)
diff --git a/lib/codemirror.css b/lib/codemirror.css
index 626d890f..1902ba4a 100644
--- a/lib/codemirror.css
+++ b/lib/codemirror.css
@@ -292,6 +292,8 @@ div.CodeMirror-cursors {
.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.CodeMirror-crosshair { cursor: crosshair; }
+.CodeMirror ::selection { background: #d7d4f0; }
+.CodeMirror ::-moz-selection { background: #d7d4f0; }
.cm-searching {
background: #ffa;
diff --git a/theme/3024-day.css b/theme/3024-day.css
index 3c01c2bf..35928162 100644
--- a/theme/3024-day.css
+++ b/theme/3024-day.css
@@ -10,6 +10,8 @@
.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-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 631757fc..ccab9d50 100644
--- a/theme/3024-night.css
+++ b/theme/3024-night.css
@@ -10,6 +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-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 c844566e..afcf15a3 100644
--- a/theme/ambiance.css
+++ b/theme/ambiance.css
@@ -30,12 +30,10 @@
.cm-s-ambiance .CodeMirror-matchingbracket { color: #0f0; }
.cm-s-ambiance .CodeMirror-nonmatchingbracket { color: #f22; }
-.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-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); }
/* Editor styling */
diff --git a/theme/base16-dark.css b/theme/base16-dark.css
index a46abdbb..b009d2b9 100644
--- a/theme/base16-dark.css
+++ b/theme/base16-dark.css
@@ -10,6 +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-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 12ff2eb0..15df6d38 100644
--- a/theme/base16-light.css
+++ b/theme/base16-light.css
@@ -10,6 +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-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 d7a2dc96..02289b63 100644
--- a/theme/blackboard.css
+++ b/theme/blackboard.css
@@ -2,6 +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-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 47440531..39155894 100644
--- a/theme/cobalt.css
+++ b/theme/cobalt.css
@@ -1,5 +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-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 ff47d7f8..25c7e0a2 100644
--- a/theme/erlang-dark.css
+++ b/theme/erlang-dark.css
@@ -1,5 +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-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 a7824747..5af8b7f6 100644
--- a/theme/lesser-dark.css
+++ b/theme/lesser-dark.css
@@ -7,6 +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-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 0ad6360b..e3987952 100644
--- a/theme/mbo.css
+++ b/theme/mbo.css
@@ -6,6 +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-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 81b21772..93293c01 100644
--- a/theme/mdn-like.css
+++ b/theme/mdn-like.css
@@ -9,6 +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-gutters { background: #f8f8f8; border-left: 6px solid rgba(0,83,159,0.65); color: #333; }
.cm-s-mdn-like .CodeMirror-linenumber { color: #aaa; margin-left: 3px; }
diff --git a/theme/midnight.css b/theme/midnight.css
index 4567d293..296af4f7 100644
--- a/theme/midnight.css
+++ b/theme/midnight.css
@@ -15,6 +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-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 548d2dff..6dfcc73c 100644
--- a/theme/monokai.css
+++ b/theme/monokai.css
@@ -2,6 +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-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 a0bf8cfa..6b2ac6c7 100644
--- a/theme/night.css
+++ b/theme/night.css
@@ -2,6 +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-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 53dcdf7a..af914b60 100644
--- a/theme/paraiso-dark.css
+++ b/theme/paraiso-dark.css
@@ -10,6 +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-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 07ca3259..e198066f 100644
--- a/theme/paraiso-light.css
+++ b/theme/paraiso-light.css
@@ -10,6 +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-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 7992ac7d..0d06f632 100644
--- a/theme/pastel-on-dark.css
+++ b/theme/pastel-on-dark.css
@@ -14,6 +14,9 @@
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-gutters {
background: #34302f;
border-right: 0px;
diff --git a/theme/rubyblue.css b/theme/rubyblue.css
index 53498389..d2fc0ecd 100644
--- a/theme/rubyblue.css
+++ b/theme/rubyblue.css
@@ -1,5 +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-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 07ef4068..4a10b7c0 100644
--- a/theme/solarized.css
+++ b/theme/solarized.css
@@ -94,13 +94,13 @@ http://ethanschoonover.com/solarized/img/solarized-palette.png
border-bottom: 1px dotted #dc322f;
}
-.cm-s-solarized.cm-s-dark .CodeMirror-selected {
- background: #073642;
-}
+.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-light .CodeMirror-selected {
- background: #eee8d5;
-}
+.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; }
/* Editor styling */
diff --git a/theme/the-matrix.css b/theme/the-matrix.css
index 01474ca9..f29b22b0 100644
--- a/theme/the-matrix.css
+++ b/theme/the-matrix.css
@@ -1,5 +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-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 84141354..5fca3caf 100644
--- a/theme/tomorrow-night-eighties.css
+++ b/theme/tomorrow-night-eighties.css
@@ -10,6 +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-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 9ca50576..889a83d7 100644
--- a/theme/twilight.css
+++ b/theme/twilight.css
@@ -1,5 +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-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 51772823..8ea53597 100644
--- a/theme/vibrant-ink.css
+++ b/theme/vibrant-ink.css
@@ -2,6 +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-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 116eccf2..d537993e 100644
--- a/theme/xq-dark.css
+++ b/theme/xq-dark.css
@@ -22,6 +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-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