frontend: Adjusting Colors for Vertical Stepper Active/Completion (#2939

)
lyft · Feb 27, 2024 · 301a053 · 301a053
1 parent 019fbeb
commit 301a053
Show file tree

Hide file tree

Showing 8 changed files with 19 additions and 13 deletions.
diff --git a/frontend/packages/core/src/stepper.tsx b/frontend/packages/core/src/stepper.tsx
@@ -64,12 +64,6 @@ const StepContainer = styled("div")<{ $orientation: StepperOrientation }>(
     ".MuiStepLabel-label.Mui-completed": {
       color: alpha(theme.palette.secondary[900], 0.38),
     },
-    ".Mui-active .MuiStepConnector-line": {
-      backgroundColor: theme.palette.primary[600],
-    },
-    ".Mui-completed .MuiStepConnector-line": {
-      backgroundColor: theme.palette.primary[600],
-    },
     ...(props.$orientation === "horizontal"
       ? {
           margin: "0px 2px 30px 2px",
@@ -89,12 +83,24 @@ const StepContainer = styled("div")<{ $orientation: StepperOrientation }>(
             backgroundColor: theme.palette.secondary[200],
             borderRadius: "4px",
           },
+          ".Mui-active .MuiStepConnector-line": {
+            backgroundColor: theme.palette.primary[600],
+          },
+          ".Mui-completed .MuiStepConnector-line": {
+            backgroundColor: theme.palette.primary[600],
+          },
         }
       : {
           margin: "0px 2px 8px 2px",
           ".MuiStepConnector-line": {
             borderColor: theme.palette.secondary[300],
           },
+          ".Mui-active .MuiStepConnector-line": {
+            borderColor: theme.palette.primary[600],
+          },
+          ".Mui-completed .MuiStepConnector-line": {
+            borderColor: theme.palette.primary[600],
+          },
         }),
   })
 );

diff --git a/frontend/workflows/ec2/src/tests/__snapshots__/reboot-instance.test.tsx.snap b/frontend/workflows/ec2/src/tests/__snapshots__/reboot-instance.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/ec2/src/tests/__snapshots__/resize-asg.test.tsx.snap b/frontend/workflows/ec2/src/tests/__snapshots__/resize-asg.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/ec2/src/tests/__snapshots__/terminate-instance.test.tsx.snap b/frontend/workflows/ec2/src/tests/__snapshots__/terminate-instance.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/envoy/src/tests/__snapshots__/remote-triage.test.tsx.snap b/frontend/workflows/envoy/src/tests/__snapshots__/remote-triage.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/k8s/src/tests/__snapshots__/delete-pod.test.tsx.snap b/frontend/workflows/k8s/src/tests/__snapshots__/delete-pod.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/k8s/src/tests/__snapshots__/resize-hpa.test.tsx.snap b/frontend/workflows/k8s/src/tests/__snapshots__/resize-hpa.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"

diff --git a/frontend/workflows/k8s/src/tests/__snapshots__/scale-resources.test.tsx.snap b/frontend/workflows/k8s/src/tests/__snapshots__/scale-resources.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`renders correctly 1`] = `
           class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto css-omj7fc-MuiGrid-root"
         >
           <div
-            class="css-bsysql"
+            class="css-146xe7x"
           >
             <div
               class="MuiStepper-root MuiStepper-horizontal MuiStepper-alternativeLabel css-10mg1vw-MuiStepper-root"