Skip to content

Tracking List for Bootstrap Migration #1442

Open
@Mephistic

Description

@Mephistic

This issue is meant to track the remaining work needed to close out the migration from css modules to react-bootstrap/styled components/typescript.

Work for each remaining component:

  • Refactor components to integrate Bootstrap and styled components while removing CSS modules.
  • When called for, find or create reusable (sub)components to reduce repetition and ensure uniformity.
  • Create or revise the Storybook story for these components, and any new sub-components.
  • Convert from js to tsx

These are the remaining components that are still using CSS modules (the remaining JS files are also covered by this list):

  • Layout.tsx (the base site layout)
  • Why Use Maple? About Pages
  • AboutPagesCard (used across several of the about pages)
  • AboutSection(The about section on the home page). This includes:
    • AboutInfoCard
  • AlertCardBody
  • The Auth Modals including:
    • StartModal
    • TermsOfServiceModal
    • VerifyEmailModal
  • The Bill Details page, specifically:
    • LobbyingTable
    • SponsorsAndCommittees
  • Divider
  • DropdownButton (Doesn't look like this is used outside of Storybook - do we still need this?)
  • PersonalInfoTab on the EditProfilePage
  • The FAQ page, including Faq, FaqCard, and FaqQandA
  • Footer (This has just been resolved: Refactor: Footer #1422)
  • PasswordInput (used in the sign up modals)
  • Our Goals And Mission page, including GoalsAndMission and GoalsAndMissionCardContent
  • HearingsScheduled
  • HeroHeader
  • HotBillCard (This has an empty module.css file, just need to fix the import - although this component doesn't seem to be used anywhere - maybe this should just be removed?)
  • Leaf
  • The Learn Testimony pages, including:
    • LearnComponents
    • BasicsOfTestimonyCard
    • LearnTestimoniesCard
    • LearnTestimoniesCardContent
    • LegislativeCard
    • LegislativeCardContent
    • RoleOfTestimonyCard
  • OurPartnersCardContent
  • The Parallax Effect, including ScrollTrackerContainer and ScrollTrackerItem
    • We have two identical versions of this, one under ParallaxEffect and one under ScrollTrackEffect - we should probably remove the former since it doesn't seem to be used)
  • PriorityBillsCard
  • ProfileLink
  • Tabs (there's a Tabs bootstrap component that might be appropriate here)
  • The Testimony Card, including:
    • BillInfoHeader
    • TestimonyItem
    • UserInfoHeader
  • Twitter (a Twitter timeline embed that doesn't seem to be used anywhere now. Should we remove this or re-add it somewhere?)

@sashamaryl Happy to break the remaining work out into sub-issues if the list looks right to you

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions