search

PolicyEngine / policyengine-app

PolicyEngine's free web app for computing the impact of public policy.
GNU Affero General Public License v3.0
35 stars 89 forks source link

Square off edges in PoliciesModelledPopup #1730

Closed anth-volk closed 2 weeks ago

anth-volk commented 3 weeks ago

The edges in the below should be squared off. This is within the household calculator side of the app.

Screen Shot 2024-05-08 at 7 53 01 PM
LDraco-Sharif commented 3 weeks ago

Hi @anth-volk, I was looking into your code and was also surprised why borders were not squared despite setting borderRadius to 0. Then I looked into the debugger.

The highlighted element here is the one you need to square off. image

But this is the element where the style (or any custom class) gets applied. image

So, based on some forum posts, this is what I decided to do. I removed the style and added a new class name to the modal. Then, I updated App.css to look for any element within that class with the class name ant-modal-content and set the border radius from there.

I have made a PR for this here. Let me know if it works on your end.

anth-volk commented 3 weeks ago

Thanks for this @LDraco-Sharif. Something we should put in our wiki (being built out as we speak) is that we typically prefer inline JS styling over CSS. We do have squared off borders on src/modals/SignupModal.jsx, so would you mind mimicking what's written there to implement this? We do appreciate your interest in contributing, just want to keep to the standards that were chosen earlier on.

LDraco-Sharif commented 3 weeks ago

@anth-volk, I tried using the method in src/modals/SignupModal.jsx but did not get too far. So, I went back and further checked documentation and found that Ant Design Modal does allow styling for ant-modal-content.

Since this fix is unrelated to the previous fix, I have decided to close that PR and open a new one here. Let me know your thought as usual.

anth-volk commented 2 weeks ago

Thanks, will do.