New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Style the shipment status as in the wireframes #1309

Merged
merged 4 commits into from Nov 7, 2018

Conversation

2 participants
@chrisgilmerproj
Contributor

chrisgilmerproj commented Nov 6, 2018

Description

Style the shipment status as in the wireframes:

  • Use the correct copy for the status messages
  • Position next to the service member name
  • Include green to black fade animation (with fallback)

Reviewer Notes

Extra scrutiny of the CSS would be appreciated.

Setup

Start with an awarded shipment from data scenario 7 and walk it through the flow to see all the status changes.

Code Review Verification Steps

  • Request review from a member of a different team.
  • Have the Pivotal acceptance criteria been met for this change?

References

Screenshots

Before:

screen shot 2018-11-06 at 12 57 54 pm

After:

Shipment Awarded:

screen shot 2018-11-06 at 12 57 23 pm

Shipment Accepted:

screen shot 2018-11-06 at 12 59 13 pm

Awaiting pre-move survey:

screen shot 2018-11-06 at 12 59 59 pm

Pre-move survey complete:

screen shot 2018-11-06 at 1 00 50 pm

Outbound:

screen shot 2018-11-06 at 1 01 26 pm

Inbound:

screen shot 2018-11-06 at 1 02 10 pm

Delivered:

screen shot 2018-11-06 at 1 02 52 pm

@chrisgilmerproj chrisgilmerproj self-assigned this Nov 6, 2018

@chrisgilmerproj chrisgilmerproj changed the title from WIP - Style the shipment status as in the wireframes to Style the shipment status as in the wireframes Nov 6, 2018

@kahlouie

Most of this looks pretty good, but I'm having trouble around the wording of the different states. It was most obvious to me around the Pm Survey. I'd love to have design take another pass at this, but it's not a blocking change.

} else if (approved && !pmSurveyComplete) {
statusText = 'Awaiting pre-move survey';
} else if (approved && pmSurveyComplete && !gblGenerated) {
statusText = 'Pre-move survey complete';

This comment has been minimized.

@kahlouie

kahlouie Nov 7, 2018

Contributor

One of the pre-move survey status texts feel a bit odd to me. Awaiting pre-move survey says what's upcoming, like Outbound and Inbound, whereas Pre-move survey complete tells me what's finished, like Shipment awarded, Shipment accepted, and Delivered. I think my brain is having difficulty with the two different kinds of things to think about by the status. I'm wondering if design has any ideas for making this a bit more consistent.

This comment has been minimized.

@chrisgilmerproj

chrisgilmerproj Nov 7, 2018

Contributor

I think I agree that the wording is a bit weird but this is what they tested and put in the wireframes. The other thing is that this isn't really Status as we think of it in the DB or ont he shipment model. It's really about the person's activity status mixed in with the shipment status.
Hopefully they'll have another chance to look at it after the PPM+HHG stuff is finished.

@chrisgilmerproj chrisgilmerproj merged commit 8f7d645 into master Nov 7, 2018

9 checks passed

ci/circleci: build_app Your tests passed on CircleCI!
Details
ci/circleci: build_migrations Your tests passed on CircleCI!
Details
ci/circleci: build_tools Your tests passed on CircleCI!
Details
ci/circleci: client_test Your tests passed on CircleCI!
Details
ci/circleci: integration_tests Your tests passed on CircleCI!
Details
ci/circleci: pre_deps_golang Your tests passed on CircleCI!
Details
ci/circleci: pre_deps_yarn Your tests passed on CircleCI!
Details
ci/circleci: pre_test Your tests passed on CircleCI!
Details
ci/circleci: server_test Your tests passed on CircleCI!
Details

@chrisgilmerproj chrisgilmerproj deleted the cg_161571820_style_shipment_status branch Nov 7, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment