Merge pull request #965 from IgniteUI/sivanova/fix-rating

simeonoff · web-flow · commit c903e5ca919e · 2025-04-16T10:26:05.000+03:00
fix(rating): styling sample issues
diff --git a/samples/inputs/rating/styling/index.html b/samples/inputs/rating/styling/index.html
@@ -15,7 +15,7 @@
 <body>
   <div id="root">
     <div class="sample center">
-      <igc-rating clas="size-large" label="Styled Rating" value="2.5" step=".5" hover-preview></igc-rating>
+      <igc-rating label="Styled Rating" value="2.5" step=".5" hover-preview></igc-rating>
     </div>
   </div>
 
diff --git a/samples/inputs/rating/styling/src/index.css b/samples/inputs/rating/styling/src/index.css
@@ -2,26 +2,24 @@
 /* https://static.infragistics.com/xplatform/css/samples */
 igc-rating {
     --symbol-size: 44px;
-    --symbol-full-color: hsla(var(--ig-warn-A400), var(--ig-warn-a));
-    --symbol-empty-color: hsla(var(--ig-warn-A400), var(--ig-warn-a));
+    --symbol-full-color: var(--ig-primary-500);
+    --symbol-empty-color: var(--ig-secondary-200);
+    --label-color: var(--ig-gray-600);
+    --ig-size: var(--ig-size-large);
 }
 
 igc-rating[disabled] {
-    --symbol-full-color: hsla(var(--ig-gray-400), var(--ig-gray-a));
-    --symbol-empty-color: hsla(var(--ig-gray-400), var(--ig-gray-a));
+    --symbol-full-color: var(--ig-gray-400);
+    --symbol-empty-color: var(--ig-gray-400);
+    --disabled-label-color: var(--ig-gray-400);
 }
 
 igc-rating::part(label) {
     font-size: 18px;
     font-weight: 600;
     text-transform: var(--ig-overline-text-transform);
-    color: hsla(var(--ig-gray-600), var(--ig-gray-a));
 }
 
 igc-rating::part(symbols) {
     gap: 8px; 
 }
-
-.size-large {
-    --ig-size: var(--ig-size-large);
-}
