mysociety / fixmystreet

This is mySociety's popular map-based reporting platform: easy to install in new countries and regions
http://fixmystreet.org/
Other
511 stars 236 forks source link

Added btn--primary class to "Continue" button in New report page #4943

Open lucascumsille opened 5 months ago

lucascumsille commented 5 months ago

Fixes: https://github.com/mysociety/societyworks/issues/4246

With this PR "Continue" button will have same styling as btn--primary, to match the branding of each cobrand, the disabled state has also been updated so it has a more evident "disabled" state.

NOTE: To fix the original issue, including btn-primary is more of a bonus, but we could also get away with keeping what we currently have and add transparentize effect that passes the contrast colour to the disabled state. However this could be an opportunity to make a standard across all cobrands the use of the mixin button-variant for btn--primary. As an extra I think we could also include an extra variable in the mixin to control the border-radius property. We would be covering more topics, so happy to open a new issue to update the "button-variant" if you think that would be better.

Preview

PR4943.pdf

Master Preview(What we currently have) Master.pdf

Default:

Screenshot 2024-05-01 at 08 35 42

Disabled

Screenshot 2024-05-01 at 08 36 28
codecov[bot] commented 5 months ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 82.64%. Comparing base (0e20599) to head (0c830cc). Report is 2 commits behind head on master.

Additional details and impacted files ```diff @@ Coverage Diff @@ ## master #4943 +/- ## ========================================== - Coverage 82.65% 82.64% -0.02% ========================================== Files 404 404 Lines 31544 31544 Branches 5005 5005 ========================================== - Hits 26074 26070 -4 - Misses 3986 3988 +2 - Partials 1484 1486 +2 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

lucascumsille commented 5 months ago

I guess it looks like the difference was the "Continue" button was steps within the process, and then the "Submit" at the end is already btn--primary as the final actual-submission step. But I guess that doesn't really matter/make any difference, if you think it makes more sense for them all to be the same, okay with me.

My thought was there is only one button visible at a time, so it didn't make much difference. With a "back" button right next to the "continue" one it would have more meaning to have a classic "primary" and "secondary" button approach.

I don't know how many things would need tidying up, I wouldn't want this to become a giant thing, but as always if it ends up making things simpler for the future, is good.

I think I'm following the same approach we have been following over the last year or so, trying to standardised the branding process with new variables and reduce the need of overrides =)