Fixes Improper padding in "Confused? Need Help?" modals #464

shuence commented 1 year ago

Fixes

Fixes #464 by @soustab10

Description

Fixed the Improper padding by changing padding in media queries.

Screenshots

Problem:

Solution:

Checklist

[x] My pull request has a descriptive title (not a vague title like Update index.md).
[x] My pull request targets the default branch of the repository (main or master).
[x] My commit messages follow best practices.
[x] My code follows the established code style of the repository.
[x] I added or updated tests for the changes I made (if applicable).
[x] I added or updated documentation (if applicable).
[x] I tried running the project locally and verified that there are no visible errors.

Developer Certificate of Origin

For the purposes of this DCO, "license" is equivalent to "license or public domain dedication," and "open source license" is equivalent to "open content license or public domain dedication."

Developer Certificate of Origin

``` Developer Certificate of Origin Version 1.1 Copyright (C) 2004, 2006 The Linux Foundation and its contributors. 1 Letterman Drive Suite D4700 San Francisco, CA, 94129 Everyone is permitted to copy and distribute verbatim copies of this license document, but changing it is not allowed. Developer's Certificate of Origin 1.1 By making a contribution to this project, I certify that: (a) The contribution was created in whole or in part by me and I have the right to submit it under the open source license indicated in the file; or (b) The contribution is based upon previous work that, to the best of my knowledge, is covered under an appropriate open source license and I have the right under that license to submit that work with modifications, whether created in whole or in part by me, under the same open source license (unless I am permitted to submit under a different license), as indicated in the file; or (c) The contribution was provided directly to me by some other person who certified (a), (b) or (c) and I have not modified it. (d) I understand and agree that this project and the contribution are public and that a record of the contribution (including all personal information I submit with it, including my sign-off) is maintained indefinitely and may be redistributed consistent with this project or the open source license(s) involved. ```

soustab10 commented 1 year ago

@shuence Can you add screenshots of the same in desktop view?

shuence commented 1 year ago

@shuence Can you add screenshots of the same in desktop view?

There is no change in desktop view as i only changed the media query

shuence commented 1 year ago

Well done, but I don't think the font-size needs to be reduced to accomplish this. I think the padding increase is enough. Please double check and consider removing the 15px font-size setting.

Thanks so much for the contribution! ❤️

Actually When changed padding

This link get bigger and pushes the container to scroll rightwords. So after adding font size 15px It also gets resolved.

soustab10 commented 1 year ago

Well done, but I don't think the font-size needs to be reduced to accomplish this. I think the padding increase is enough. Please double check and consider removing the 15px font-size setting.

Thanks so much for the contribution! ❤️

Actually When changed padding

This link get bigger and pushes the container to scroll rightwords.

So after adding font size 15px It also gets resolved.

Play with overflow-x values and/or set the max-width of the text container the same as the modal width.

shuence commented 1 year ago

Well done, but I don't think the font-size needs to be reduced to accomplish this. I think the padding increase is enough. Please double check and consider removing the 15px font-size setting.

Thanks so much for the contribution! ❤️

I made the necessary changes as per your review

possumbilities commented 1 year ago

@shuence Can you add screenshots of the same in desktop view?

There is no change in desktop view as i only changed the media query

Yes, I meant adding it at all, even for the media query.

For the long links going outside the modal I'd suggest trying an approach like this: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/

shuence commented 1 year ago

@shuence Can you add screenshots of the same in desktop view?

There is no change in desktop view as i only changed the media query

Yes, I meant adding it at all, even for the media query.

For the long links going outside the modal I'd suggest trying an approach like this: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/

That's a different issue #463 Someone is working on it I think for this PR fixes #465 properly. I checked that the link seems fine on 99% of the mobile devices without any change

creativecommons / chooser