The Character Card is not responsive as it is not working properly for smaller devices
Steps to reproduce the behavior:
Open the page on any modern browser (Chrome, Firefox, Safari, etc.).
Resize the browser window to simulate different device widths or use the browser's Responsive Design Mode (e.g., in Chrome DevTools).
Test the layout at various breakpoints:
Mobile: 320px - 480px
Tablet: 768px - 1024px
Small Desktop: 1024px - 1280px
Observe the layout and styling issues.
Expected behavior
The page should adjust its layout responsively across different screen sizes. All elements (e.g., buttons, text, images) should scale and align properly without overlapping or breaking out of containers.
The Character Card is not responsive as it is not working properly for smaller devices
Steps to reproduce the behavior: Open the page on any modern browser (Chrome, Firefox, Safari, etc.). Resize the browser window to simulate different device widths or use the browser's Responsive Design Mode (e.g., in Chrome DevTools). Test the layout at various breakpoints: Mobile: 320px - 480px Tablet: 768px - 1024px Small Desktop: 1024px - 1280px Observe the layout and styling issues.
Expected behavior The page should adjust its layout responsively across different screen sizes. All elements (e.g., buttons, text, images) should scale and align properly without overlapping or breaking out of containers.
Screencast from 2024-10-13 21-26-14.webm Please assign this issue to me, I can work on it and fix this issue! Thanks!!