From e919e38bf9af52601d791a140d9855e2b7ca9ec9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Mon, 3 May 2021 15:32:10 +0200
Subject: [PATCH] MOBILE-3745 a11y: Add contrast to chevrons

---
 src/theme/components/format-text.scss | 10 +++++-----
 src/theme/theme.base.scss             |  5 +++--
 src/theme/theme.dark.scss             |  7 ++-----
 src/theme/theme.light.scss            | 11 ++++++++++-
 4 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/theme/components/format-text.scss b/src/theme/components/format-text.scss
index e94b4814e..31c6554ca 100644
--- a/src/theme/components/format-text.scss
+++ b/src/theme/components/format-text.scss
@@ -47,10 +47,6 @@ core-format-text {
                     background-color: var(--background);
                     color: var(--color);
                     padding-left: 10px; // RTL
-                    /*@include darkmode() {
-                        color: var(--white);
-                        background-color: $core-dark-item-bg-color;
-                    }*/
                 }
 
                 &:before {
@@ -71,12 +67,16 @@ core-format-text {
 
         &.core-expand-in-fullview {
             .core-show-more {
-                @include push-arrow-color(dedede, true);
+                @include push-arrow-color(626262, true);
                 @include padding-horizontal(null, 18px);
                 @include background-position(end, 0, center);
 
                 background-repeat: no-repeat;
                 background-size: 14px 14px;
+
+                @include darkmode() {
+                    @include push-arrow-color(ffffff, true);
+                }
             }
         }
     }
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index a3b41bb81..999118e32 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -149,8 +149,9 @@ ion-alert.core-nohead {
 // Ionic item divider.
 ion-item-divider {
     .item-detail-icon {
-        font-size: 20px;
-        opacity: 0.25;
+        color: var(--ion-item-detail-icon-color);
+        font-size: var(--ion-item-detail-icon-font-size);
+        opacity: var(--ion-item-detail-icon-opacity);
         padding-inline-end: 16px;
     }
 
diff --git a/src/theme/theme.dark.scss b/src/theme/theme.dark.scss
index c8ab76fec..37126c70e 100644
--- a/src/theme/theme.dark.scss
+++ b/src/theme/theme.dark.scss
@@ -43,8 +43,6 @@
 
     --ion-tab-bar-background: #1f1f1f;
 
-    --ion-item-background: #1e1e1e;
-
     --ion-card-background: #1c1c1d;
 
     ion-content {
@@ -62,12 +60,11 @@
         --text-color: var(--custom-progress-text-color, var(--gray-lighter));
     }
 
+    --ion-item-background: #1e1e1e;
+    --ion-item-detail-icon-color: var(--white);
     ion-item-divider {
         --background: var(--black);
         --color: var(--white);
-        .item-detail-icon {
-            color: var(--white);
-        }
     }
 
     --core-button-select-background: var(--custom-button-select-background, #3a3a3a);
diff --git a/src/theme/theme.light.scss b/src/theme/theme.light.scss
index 13f04e715..dc8e0a9ee 100644
--- a/src/theme/theme.light.scss
+++ b/src/theme/theme.light.scss
@@ -65,7 +65,6 @@
     --ion-text-color: #{$text-color};
     --ion-text-color-rgb: 58,58,58;
     --ion-card-color: var(--ion-text-color);
-    --ion-item-background: var(--white);
 
     --text-hightlight-background-color: var(--custom-text-hightlight-background-color, #99c1ed);
 
@@ -144,6 +143,16 @@
         --side-blocks-min-width: var(--custom-side-blocks-min-width, 280px);
     }
 
+    --ion-item-background: var(--white);
+    --ion-item-detail-icon-color: var(--gray-darker);
+    --ion-item-detail-icon-font-size: 20px;
+    --ion-item-detail-icon-opacity: 1;
+    ion-item {
+        --detail-icon-color: var(--ion-item-detail-icon-color);
+        --detail-icon-font-size: var(--ion-item-detail-icon-font-size);
+        --detail-icon-opacity: var(--ion-item-detail-icon-opacity);
+    }
+
     ion-item-divider {
         --background: var(--gray-lighter);
         --color: inherit;