Responsive Design for ContributorCard Component using styled-components

3ein39 commented 12 months ago

This pull request introduces changes to the ContributorCard component to make it responsive using the styled-components library.

Changes include:

Removal of display: flex; on small screens to stack the image and text vertically.
Addition of display: flex; on larger screens to align the image and text horizontally.
Adjustment of the ImageContainer div and the image within it to take up 100% of the width of their parent element on small screens, and have a fixed size of 150px on larger screens.
Use of styled-components to create Card and ImageContainer components with media queries for responsive design.

These changes ensure that the ContributorCard component adapts to different screen sizes, improving the overall user experience on both small and large screens. The use of styled-components allows for more modular and reusable CSS in JS.

netlify[bot] commented 12 months ago

Deploy Preview for activecourses ready!

Name	Link
Latest commit	7676fd7f26de810edbd8dfc08d55c3c2d43eea19
Latest deploy log	https://app.netlify.com/sites/activecourses/deploys/6575a30ed277270008f42b05
Deploy Preview	https://deploy-preview-6--activecourses.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

3ein39 commented 12 months ago

Hello Aly, Feel free to take a look and let me know if everything aligns with the expected changes. Thanks again for your collaboration!

3ein39 commented 12 months ago

Done

alikehel / activecourses