Update styles for progress (#2570)

reflex/components/radix/primitives/progress.py

@@ -6,6 +6,7 @@ from types import SimpleNamespace
 from typing import Optional
 
 from reflex.components.component import Component
+from reflex.components.radix.primitives.accordion import DEFAULT_ANIMATION_DURATION
 from reflex.components.radix.primitives.base import RadixPrimitiveComponentWithClassName
 from reflex.style import Style
 from reflex.vars import Var
@@ -34,10 +35,11 @@ class ProgressRoot(ProgressComponent):
             {
                 "position": "relative",
                 "overflow": "hidden",
-                "background": "black",
+                "background": "var(--gray-a3)",
                 "border_radius": "99999px",
-                "width": "300px",
-                "height": "25px",
+                "width": "100%",
+                "height": "20px",
+                "boxShadow": "inset 0 0 0 1px var(--gray-a5)",
                 **self.style,
             }
         )
@@ -56,14 +58,15 @@ class ProgressIndicator(ProgressComponent):
     def _apply_theme(self, theme: Component):
         self.style = Style(
             {
-                "background-color": "white",
+                "background-color": "var(--accent-9)",
                 "width": "100%",
                 "height": "100%",
-                "transition": f"transform 660ms linear",
+                f"transition": f"transform {DEFAULT_ANIMATION_DURATION}ms linear",
                 "&[data_state='loading']": {
-                    "transition": f"transform 660ms linear",
+                    "transition": f"transform {DEFAULT_ANIMATION_DURATION}ms linear",
                 },
                 "transform": f"translateX(-{100 - self.value}%)",  # type: ignore
+                "boxShadow": "inset 0 0 0 1px var(--gray-a5)",
             }
         )
 

reflex/components/radix/primitives/progress.pyi

@@ -10,6 +10,7 @@ from reflex.style import Style
 from types import SimpleNamespace
 from typing import Optional
 from reflex.components.component import Component
+from reflex.components.radix.primitives.accordion import DEFAULT_ANIMATION_DURATION
 from reflex.components.radix.primitives.base import RadixPrimitiveComponentWithClassName
 from reflex.style import Style
 from reflex.vars import Var