Bug 1855571 - Update star rating design

app/src/main/java/org/mozilla/fenix/shopping/ui/StarRating.kt

@@ -15,6 +15,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.contentDescription
@@ -55,17 +56,22 @@ fun StarRating(
         horizontalArrangement = Arrangement.spacedBy(4.dp),
     ) {
         repeat(NUM_STARS) {
-            val starId = if (it < rating && it + 1 > rating) {
-                R.drawable.ic_star_half
+            val starId: Int
+            val colorFilter: ColorFilter?
+            if (it < rating && it + 1 > rating) {
+                starId = R.drawable.mozac_ic_star_one_half_fill_20
+                colorFilter = null // use the colors values in the vector
             } else if (it < rating) {
-                R.drawable.ic_bookmark_filled
+                starId = R.drawable.mozac_ic_star_fill_20
+                colorFilter = ColorFilter.tint(colorResource(id = R.color.mozac_ic_star_filled))
             } else {
-                R.drawable.ic_bookmark_outline
+                starId = R.drawable.mozac_ic_star_fill_20
+                colorFilter = ColorFilter.tint(colorResource(id = R.color.mozac_ic_star_unfilled))
             }
 
             Image(
                 painter = painterResource(id = starId),
-                colorFilter = ColorFilter.tint(FirefoxTheme.colors.iconPrimary),
+                colorFilter = colorFilter,
                 contentDescription = null,
             )
         }

app/src/main/res/drawable/ic_star_half.xml

@@ -1,17 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-    <path
-        android:fillColor="?attr/textPrimary"
-        android:pathData="M7.23,21.5C6.79,21.5 6.34,21.36 5.97,21.09C5.25,20.57 4.93,19.68 5.15,18.82L6.21,14.67L2.91,11.93C2.23,11.36 1.96,10.45 2.24,9.61C2.51,8.77 3.26,8.18 4.15,8.13L8.43,7.85L10.01,3.87C10.34,3.05 11.12,2.51 12.01,2.51C12.9,2.51 13.68,3.04 14.01,3.87L15.59,7.85L19.87,8.13C20.75,8.19 21.5,8.77 21.78,9.61C22.05,10.45 21.79,11.37 21.11,11.93L17.81,14.67L18.87,18.82C19.09,19.68 18.77,20.57 18.05,21.09C17.33,21.61 16.38,21.64 15.63,21.17L12.01,18.88L8.39,21.17C8.04,21.39 7.64,21.51 7.24,21.51L7.23,21.5ZM12,4.25C11.9,4.25 11.71,4.28 11.63,4.5L9.84,9C9.72,9.31 9.42,9.53 9.08,9.55L4.25,9.86C4.01,9.88 3.92,10.04 3.89,10.14C3.86,10.22 3.83,10.42 4.02,10.58L7.74,13.67C8,13.89 8.11,14.23 8.03,14.56L6.84,19.25C6.78,19.48 6.91,19.62 6.99,19.68C7.07,19.74 7.24,19.82 7.44,19.69L11.53,17.1C11.82,16.92 12.18,16.92 12.46,17.1L16.55,19.69C16.75,19.82 16.92,19.74 17,19.68C17.08,19.62 17.21,19.48 17.15,19.25L15.95,14.56C15.87,14.23 15.98,13.89 16.24,13.67L19.96,10.58C20.15,10.42 20.11,10.22 20.09,10.15C20.06,10.05 19.97,9.89 19.73,9.87L14.9,9.56C14.56,9.54 14.27,9.32 14.14,9.01L12.35,4.51C12.26,4.29 12.08,4.26 11.98,4.26L12,4.25Z" />
-    <path
-        android:fillColor="?attr/textPrimary"
-        android:fillType="evenOdd"
-        android:pathData="M5.833,21.2C6.107,21.399 6.427,21.5 6.749,21.5C7.037,21.5 7.325,21.419 7.583,21.257L11.909,18.522L12,18.58V2.503C11.97,2.501 11.94,2.5 11.909,2.5C11.266,2.5 10.697,2.886 10.46,3.482L8.567,8.237L3.459,8.568C2.818,8.61 2.276,9.032 2.077,9.643C1.879,10.254 2.07,10.913 2.564,11.324L6.502,14.594L5.239,19.553C5.08,20.176 5.313,20.822 5.833,21.2ZM17.132,21.5H17.004C17.047,21.502 17.09,21.502 17.132,21.5Z" />
-</vector>

app/src/main/res/values-night/colors.xml

@@ -168,4 +168,8 @@
 
     <!-- Add-ons colors -->
     <color name="mozac_feature_addons_error_text_color">@color/photonRed20</color>
+
+    <!-- Star icon fill colors -->
+    <color name="mozac_ic_star_filled">@color/photonLightGrey40</color>
+    <color name="mozac_ic_star_unfilled">@color/photonDarkGrey05</color>
 </resources>

app/src/main/res/values/colors.xml

@@ -356,4 +356,8 @@
 
     <!-- Add-ons colors -->
     <color name="mozac_feature_addons_error_text_color" tools:ignore="UnusedResources">@color/photonRed70</color>
+
+    <!-- Star icon fill colors -->
+    <color name="mozac_ic_star_filled">@color/photonBlack</color>
+    <color name="mozac_ic_star_unfilled">#D9D9D9</color>
 </resources>