Remove excess lefthand padding/margin in ordered lists in Formation

GnatalieH commented 1 year ago

Description

The excess lefthand padding/margin space in ordered lists in Formation creates a situation where about 25% of the lefthand side of the screen is taken up by white space in the mobile view. This leads to more scrolling and is bad for readability on mobile. We should remove unnecessary padding, which is also closer to how USWDS does it.

Details

Current state in Production:

localhost_3001_decision-reviews_supplemental-claim_file-supplemental-claim-form-20-0995_form-saved (1).png

Suggested improvement:

Screen Shot 2022-11-28 at 2.37.34 PM.png

USWDS example:

Screen Shot 2022-11-28 at 2.35.02 PM.png

Tasks

Research how making this fix in Formation will impact things site-wide
Remove excess margin/padding for ordered lists in Formation

caw310 commented 1 year ago

@LillyBoot @babsdenney , do we still need this or can we close?

babsdenney commented 1 year ago

@caw310 @LillyBoot Looking at the documentation this is still an issue. We can keep this open.

VADS Typography

caw310 commented 3 weeks ago

@babsdenney do we still need issue?

babsdenney commented 3 weeks ago

Yes still needed, I discussed this with @danbrady and @LWWright7 and we can expand this ticket to:

Remove all additional styles added to VADS lists and align with the USWDS list styles. So no more square bullets or extra spacing on the list.
Remove the "List" navigational menu on the Typography page.

department-of-veterans-affairs / vets-design-system-documentation