Implement Ride Modal Styling

[selenaliu1]

Summary

This pull request is a work in progress for implementing the new designs for adding a ride. I added the Clear All button, added icons, and fixed formatting, ie. having labels and inputs on separate lines.

Test Plan

updated after merging:

previous:

I continuously tested between each change I made.

Notes

Still need to figure out how to make the modal larger, and fix Repeats.
Created a container that is used in Ride Information Modal as well, will need to fix.

Breaking Changes

When I click on Custom under the Repeats dropdown, the additional info doesn't currently pop up.

[dti-github-bot]

[diff-counting] Significant lines: 90.

[namanhboi]

Hi Selena, great work on redesigning the Modal and adding the Clear All button, everthing looks clean and follows Lazim's design closely.

I am not exactly sure why the DaySelector might not show up since you didn't change the name of the select component for the repeats.

But, you can try to change the size of the modal by adding height and width properties to the .form in ridemodal.module.css. When you add these properties, try to use rem instead of px since that's better for responsive design. Here is a converter between px and rem: https://nekocalc.com/px-to-rem-converter.

Also, I think you need to run prettier on ridermodal.module.css to make the failed check go away.