MOBILE-3563 more: Add custom colors to more page

src/core/features/mainmenu/pages/more/more.scss

@@ -0,0 +1,17 @@
+ion-item {
+	--border-color: var(--core-more-item-border,
+        var(--ion-item-border-color,
+        var(--ion-border-color,
+        var(--ion-color-step-150,
+        rgba(0, 0, 0, 0.13)))));
+
+    ion-icon {
+        color: var(--core-more-icon, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54));
+    }
+}
+
+:host-context(ion-app.ios) {
+    ion-item ion-icon {
+        color: var(--core-more-icon, inherit);
+    }
+}

src/core/features/mainmenu/pages/more/more.ts

@@ -34,6 +34,7 @@ import { Translate } from '@singletons';
 @Component({
     selector: 'page-core-mainmenu-more',
     templateUrl: 'more.html',
+    styleUrls: ['more.scss'],
 })
 export class CoreMainMenuMorePage implements OnInit, OnDestroy {
 

src/theme/globals.variables.scss

@@ -250,3 +250,6 @@ $addon-forum-highlight-color: $gray-lighter !default;
 
 $addon-forum-border-color-dark: $gray-darker !default;
 $addon-forum-highlight-color-dark: $gray-dark !default;
+
+$core-more-icon: null !default;
+$core-more-item-border: null !default;

src/theme/theme.light.scss

@@ -244,4 +244,11 @@
 
     --core-dd-question-selected-shadow: 2px 2px 4px var(--gray-dark);
 
+    @if ($core-more-icon) {
+        --core-more-icon: #{$core-more-icon};
+    }
+
+    @if ($core-more-item-border) {
+        --core-more-item-border: #{$core-more-item-border};
+    }
 }