From e9f65e6ee5413b8e4affc74b181e344551ff05db Mon Sep 17 00:00:00 2001
From: Mohd Imran <imranrcazy200@gmail.com>
Date: Fri, 19 Feb 2021 15:57:58 +0530
Subject: [PATCH] added new WCAG AA and AAA compliant text selection colors

---
 client/styles/abstracts/_variables.scss | 6 ++++++
 client/styles/base/_base.scss           | 8 ++++++++
 2 files changed, 14 insertions(+)

diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss
index 514c2c0146..b9a16d87a3 100644
--- a/client/styles/abstracts/_variables.scss
+++ b/client/styles/abstracts/_variables.scss
@@ -83,6 +83,8 @@ $themes: (
     input-text-color: $dark,
     input-background-color: $lightest,
     input-secondary-background-color: $lightest,
+    input-selection-text-color: $dark,
+    input-selection-background-color: $medium-light,
     input-border-color: $middle-light,
     search-background-color: $lightest,
     search-clear-background-color: $light,
@@ -163,6 +165,8 @@ $themes: (
     input-text-color: $lightest,
     input-background-color: $dark,
     input-secondary-background-color: $medium-dark,
+    input-selection-text-color: $darkest,
+    input-selection-background-color: $lightest,
     input-border-color: $middle-dark,
     search-background-color: $lightest,
     search-clear-background-color: $medium-dark,
@@ -241,6 +245,8 @@ $themes: (
     input-text-color: $lightest,
     input-background-color: $dark,
     input-secondary-background-color: $medium-dark,
+    input-selection-text-color: $darkest,
+    input-selection-background-color: $lightest,
     input-border-color: $middle-dark,
     search-background-color: $white,
     search-clear-background-color: $medium-dark,
diff --git a/client/styles/base/_base.scss b/client/styles/base/_base.scss
index d824c64648..d9751672e3 100644
--- a/client/styles/base/_base.scss
+++ b/client/styles/base/_base.scss
@@ -44,6 +44,14 @@ textarea {
 	}
 }
 
+input::selection,
+textarea::selection {
+	@include themify() {
+		color: getThemifyVariable('input-selection-text-color');
+		background-color: getThemifyVariable('input-selection-background-color');
+	}
+}
+
 button[type="submit"],
 input[type="submit"] {
 	@include themify() {