Use rgba as background color for selection to fix chrome transpa

rent selection issue
jcubic · Feb 5, 2017 · fd06c5a · fd06c5a
1 parent dd3b235
commit fd06c5a
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 12 deletions.
diff --git a/css/jquery.terminal-0.11.23.css b/css/jquery.terminal-0.11.23.css
@@ -12,7 +12,7 @@
  * Copyright (c) 2011-2017 Jakub Jankiewicz <http://jcubic.pl>
  * Released under the MIT license
  *
- * Date: Sun, 05 Feb 2017 15:12:40 +0000
+ * Date: Sun, 05 Feb 2017 16:36:46 +0000
  */
 .terminal .terminal-output .format, .cmd .format,
 .cmd .prompt, .cmd .prompt div, .terminal .terminal-output div div{
@@ -359,7 +359,11 @@
 .cmd > div::selection,
 .cmd > div span::selection,
 .cmd .prompt span::selection {
-    background-color: #aaa;
+    /*
+     * use rgba to fix transparent selection in chrome
+     * http://stackoverflow.com/questions/7224445/css3-selection-behaves-differently-in-ff-chrome
+     */
+    background-color: rgba(170, 170, 170, 0.99);
     color: #000;
 }
 .terminal .terminal-output div.error, .terminal .terminal-output div.error div {
@@ -455,7 +459,7 @@
     .cmd > div::selection,
     .cmd > div span::selection,
     .cmd .prompt span::selection {
-        background-color: var(--color, #aaa);
+        background-color: var(--color, rgba(170, 170, 170, 0.99));
         color: var(--background, #000);
     }
     @-webkit-keyframes terminal-blink {

diff --git a/css/jquery.terminal-0.11.23.min.css b/css/jquery.terminal-0.11.23.min.css
diff --git a/css/jquery.terminal-src.css b/css/jquery.terminal-src.css
@@ -359,7 +359,11 @@
 .cmd > div::selection,
 .cmd > div span::selection,
 .cmd .prompt span::selection {
-    background-color: #aaa;
+    /*
+     * use rgba to fix transparent selection in chrome
+     * http://stackoverflow.com/questions/7224445/css3-selection-behaves-differently-in-ff-chrome
+     */
+    background-color: rgba(170, 170, 170, 0.99);
     color: #000;
 }
 .terminal .terminal-output div.error, .terminal .terminal-output div.error div {
@@ -455,7 +459,7 @@
     .cmd > div::selection,
     .cmd > div span::selection,
     .cmd .prompt span::selection {
-        background-color: var(--color, #aaa);
+        background-color: var(--color, rgba(170, 170, 170, 0.99));
         color: var(--background, #000);
     }
     @-webkit-keyframes terminal-blink {

diff --git a/css/jquery.terminal.css b/css/jquery.terminal.css
@@ -12,7 +12,7 @@
  * Copyright (c) 2011-2017 Jakub Jankiewicz <http://jcubic.pl>
  * Released under the MIT license
  *
- * Date: Sun, 05 Feb 2017 15:12:40 +0000
+ * Date: Sun, 05 Feb 2017 16:36:46 +0000
  */
 .terminal .terminal-output .format, .cmd .format,
 .cmd .prompt, .cmd .prompt div, .terminal .terminal-output div div{
@@ -359,7 +359,11 @@
 .cmd > div::selection,
 .cmd > div span::selection,
 .cmd .prompt span::selection {
-    background-color: #aaa;
+    /*
+     * use rgba to fix transparent selection in chrome
+     * http://stackoverflow.com/questions/7224445/css3-selection-behaves-differently-in-ff-chrome
+     */
+    background-color: rgba(170, 170, 170, 0.99);
     color: #000;
 }
 .terminal .terminal-output div.error, .terminal .terminal-output div.error div {
@@ -455,7 +459,7 @@
     .cmd > div::selection,
     .cmd > div span::selection,
     .cmd .prompt span::selection {
-        background-color: var(--color, #aaa);
+        background-color: var(--color, rgba(170, 170, 170, 0.99));
         color: var(--background, #000);
     }
     @-webkit-keyframes terminal-blink {