MOBILE-3745 a11y: Add contrast to chevrons

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);
+                }
             }
         }
     }

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;
     }
 

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);

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;