Refactored code. Progress bar now is empty on first step of intake. #759

mexi-cano · 2023-11-20T19:40:46Z

What (if anything) did you refactor?

Intake progress bar is now empty on first step.

sydney-devine · 2023-11-27T20:49:40Z

@mexi-cano @bespinosa01 Can we get rid of that border that surrounds the entire progress bar to make the entire thing flat?

Comp for reference

mexi-cano · 2023-11-28T19:26:57Z

@mexi-cano @bespinosa01 Can we get rid of that border that surrounds the entire progress bar to make the entire thing flat?

Comp for reference

Done!

sydney-devine · 2023-11-28T19:27:49Z

@mexi-cano @bespinosa01 Can we get rid of that border that surrounds the entire progress bar to make the entire thing flat?
Comp for reference

Done! Updated the same picture twi

ce previously.

sydney-devine · 2023-11-28T19:32:43Z

@mexi-cano This looks great now - TY for making those changes. Pending code review, this looks good on my end.

src/Components/ProgressBar/ProgressBar.tsx

CalebPena · 2023-11-29T17:54:06Z

src/Components/ProgressBar/ProgressBar.tsx

    '& .MuiLinearProgress-bar': {
-      background: `linear-gradient(90deg, ${theme.primaryColor} 0%, ${theme.secondaryColor} 100%)`,
+      background: '#D6743F',


We use a style controller for colors, because we have some partners that want branded colors for people coming from their link. I created an issue to update it. When that gets updated could you use them.whateverColor for colors.

I'll wait for the issue to be completed to update this accordingly. thanks!

Hard-coded colors have been updated to theme colors.

…-bar-update

src/Components/ProgressBar/ProgressBar.tsx

CalebPena · 2023-12-07T19:14:37Z

src/Components/ProgressBar/ProgressBar.tsx

    '& .MuiLinearProgress-bar': {
-      background: `linear-gradient(90deg, ${theme.primaryColor} 0%, ${theme.secondaryColor} 100%)`,
+      background: theme.terraCottaColor,


Can we use theme.secondaryColor?

Color updated. Current state of the progress bar:

…bar background color.

CalebPena

Thank you, code looks good. @sydney-devine Is the progress bar styling correct?

sydney-devine · 2023-12-08T21:07:17Z

Thank you, code looks good. @sydney-devine Is the progress bar styling correct?

Looks good to me from the screenshot!

sydney-devine · 2023-12-12T21:31:34Z

@mexi-cano & @CalebPena I just played with this in stage. Looks like on Step 12, the bar isn't going all the way to the end anymore. Can we please fix this.

mexi-cano · 2023-12-12T22:41:31Z

I can update it so that it's full. My train of thought here is that having the progress bar show progress on step 1 was similar to have the progress bar full on step 12. Submitting step 1 updates the progress as submitting step 12 would.

sydney-devine · 2023-12-13T17:46:08Z

I can update it so that it's full. My train of thought here is that having the progress bar show progress on step 1 was similar to have the progress bar full on step 12. Submitting step 1 updates the progress as submitting step 12 would.

Yea, I agree with you. I think the only difference on this one is that the progress bar doesn't show on the final results page, so think it would make sense for it to be full on the last page that users actually see it since they're done inputting information at that point.

sydney-devine · 2023-12-13T21:53:02Z

@mexi-cano Slightly annoying request after looking at this in stage. Can we change the fill color on the progress bar to #D6743F? It's a slightly brighter terra cotta.

CalebPena · 2023-12-13T22:02:38Z

@mexi-cano Slightly annoying request after looking at this in stage. Can we change the fill color on the progress bar to #D6743F? It's a slightly brighter terra cotta.

I can change it in the 211 rebrand ticket. I had to add a progress bar color to the style controller, and I don't want to cause any conflicts

sydney-devine · 2023-12-13T22:06:10Z

@mexi-cano Slightly annoying request after looking at this in stage. Can we change the fill color on the progress bar to #D6743F? It's a slightly brighter terra cotta.

I can change it in the 211 rebrand ticket. I had to add a progress bar color to the style controller, and I don't want to cause any conflicts

Yes pls. TY!

mexi-cano · 2023-12-13T23:15:44Z

@mexi-cano Slightly annoying request after looking at this in stage. Can we change the fill color on the progress bar to #D6743F? It's a slightly brighter terra cotta.

I can change it in the 211 rebrand ticket. I had to add a progress bar color to the style controller, and I don't want to cause any conflicts

Yes pls. TY!

I updated the progress bar. It now shows as full on the final step before submission. I did not change the color.

Screen.Recording.2023-12-13.at.6.10.45.PM.mov

sydney-devine · 2023-12-13T23:20:31Z

@mexi-cano Slightly annoying request after looking at this in stage. Can we change the fill color on the progress bar to #D6743F? It's a slightly brighter terra cotta.

I can change it in the 211 rebrand ticket. I had to add a progress bar color to the style controller, and I don't want to cause any conflicts

Yes pls. TY!

I updated the progress bar. It now shows as full on the final step before submission. I did not change the color.

Screen.Recording.2023-12-13.at.6.10.45.PM.mov

TY!! Looks great!

Refactored code. Progress bar now is empty on first step of intake.

b28e1c3

mexi-cano requested a review from bespinosa01 November 20, 2023 19:40

mexi-cano linked an issue Nov 20, 2023 that may be closed by this pull request

Branding Update: Progress Bar #735

Closed

bespinosa01 changed the title ~~Refactored code. Progress bar now is empty on first step of intake.~~ [WIP] Refactored code. Progress bar now is empty on first step of intake. Nov 20, 2023

mexi-cano added 2 commits November 20, 2023 15:45

Updated progress styling.

6298cd7

Prettier changes

341cb39

sydney-devine requested review from civicpixel, CalebPena and ivonne-hernandez November 27, 2023 20:47

Removed progress bar border.

5dbc211

Removed border shadow

fbcd6e0

mexi-cano requested a review from sydney-devine November 28, 2023 19:32

bespinosa01 changed the title ~~[WIP] Refactored code. Progress bar now is empty on first step of intake.~~ Refactored code. Progress bar now is empty on first step of intake. Nov 29, 2023

CalebPena reviewed Nov 29, 2023

View reviewed changes

mexi-cano added 2 commits November 29, 2023 13:47

Reverted nullish coalescing approach.

2c02827

Merge branch 'main' into refactor/progress-bar-update

c58a10b

mexi-cano changed the base branch from main to Marianna/734/typography-updates December 6, 2023 19:04

mexi-cano added 2 commits December 6, 2023 14:17

Merge branch 'Marianna/734/typography-updates' into refactor/progress…

98c0b55

…-bar-update

Updated hard coded colors to theme variables.

8c372dc

CalebPena reviewed Dec 7, 2023

View reviewed changes

Updated terraCotta color to secondary theme color. Reverted progress …

206dd35

…bar background color.

CalebPena approved these changes Dec 8, 2023

View reviewed changes

CalebPena merged commit 48f7b25 into Marianna/734/typography-updates Dec 8, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Refactored code. Progress bar now is empty on first step of intake. #759

Refactored code. Progress bar now is empty on first step of intake. #759

mexi-cano commented Nov 20, 2023 •

edited

Loading

sydney-devine commented Nov 27, 2023

mexi-cano commented Nov 28, 2023 •

edited

Loading

sydney-devine commented Nov 28, 2023 •

edited by mexi-cano

Loading

sydney-devine commented Nov 28, 2023

CalebPena Nov 29, 2023 •

edited

Loading

mexi-cano Nov 29, 2023

mexi-cano Dec 6, 2023

CalebPena Dec 7, 2023

mexi-cano Dec 7, 2023

CalebPena left a comment

sydney-devine commented Dec 8, 2023

sydney-devine commented Dec 12, 2023 •

edited

Loading

mexi-cano commented Dec 12, 2023

sydney-devine commented Dec 13, 2023

sydney-devine commented Dec 13, 2023

CalebPena commented Dec 13, 2023

sydney-devine commented Dec 13, 2023

mexi-cano commented Dec 13, 2023 •

edited

Loading

sydney-devine commented Dec 13, 2023

Refactored code. Progress bar now is empty on first step of intake. #759

Refactored code. Progress bar now is empty on first step of intake. #759

Conversation

mexi-cano commented Nov 20, 2023 • edited Loading

sydney-devine commented Nov 27, 2023

mexi-cano commented Nov 28, 2023 • edited Loading

sydney-devine commented Nov 28, 2023 • edited by mexi-cano Loading

sydney-devine commented Nov 28, 2023

CalebPena Nov 29, 2023 • edited Loading

Choose a reason for hiding this comment

mexi-cano Nov 29, 2023

Choose a reason for hiding this comment

mexi-cano Dec 6, 2023

Choose a reason for hiding this comment

CalebPena Dec 7, 2023

Choose a reason for hiding this comment

mexi-cano Dec 7, 2023

Choose a reason for hiding this comment

CalebPena left a comment

Choose a reason for hiding this comment

sydney-devine commented Dec 8, 2023

sydney-devine commented Dec 12, 2023 • edited Loading

mexi-cano commented Dec 12, 2023

sydney-devine commented Dec 13, 2023

sydney-devine commented Dec 13, 2023

CalebPena commented Dec 13, 2023

sydney-devine commented Dec 13, 2023

mexi-cano commented Dec 13, 2023 • edited Loading

sydney-devine commented Dec 13, 2023

mexi-cano commented Nov 20, 2023 •

edited

Loading

mexi-cano commented Nov 28, 2023 •

edited

Loading

sydney-devine commented Nov 28, 2023 •

edited by mexi-cano

Loading

CalebPena Nov 29, 2023 •

edited

Loading

sydney-devine commented Dec 12, 2023 •

edited

Loading

mexi-cano commented Dec 13, 2023 •

edited

Loading