Implement `styled-components` to the project

[mariana-caldas]

What do we need to build or fix?

We need to implement styled-components to the project by converting all the components to use this new library for styling.

Technical details

• Create a new branch named feature/styled-components-conversion and checkout to it.
• Update all the components to use styled-components for styling.
• Remove any existing inline styles or global styles that are not necessary.
• Test the components in different screen sizes and browsers to ensure they look and function as expected.
• Commit the changes to the feature/styled-components-conversion branch and create a pull request to merge the changes into the main branch.
• Follow the discussion about the new styled-components name convention on issue #160

Approach suggestions

• https://styled-components.com/docs/basics#getting-started

Deadline

Please keep in mind that once you assign this task to yourself, you'll need to complete it in 3 weeks.

Acceptance criteria

• All components should be styled using styled-components.
• All components should look and function as expected in different screen sizes (you can use the Inspect tool for that) and browsers(Chrome, Firefox, Edge, and Safari for MAC)
• If there are any build problems when submitting your PR, run yarn build locally to solve the issues and commit the changes.
• Update the CHANGELOG.md file.