thoughtworks / build-your-own-radar

A library that generates an interactive radar, inspired by https://thoughtworks.com/radar/.
GNU Affero General Public License v3.0
2.21k stars 1.04k forks source link

Zooming out UI break fix #384

Open kbhatnagar97 opened 2 months ago

kbhatnagar97 commented 2 months ago

Steps, Observations and Solution

Step 1: Open Thoughtworks Radar

Screenshot 2024-08-27 at 2 54 02 PM

Step 2: Zoom into the 4 image quadrant view (i.e. 150% zoom)

Screenshot 2024-08-27 at 2 54 19 PM

Step 3: Click on any one of the 4 quadrants (i.e. switch tabs on the radar view)

Screenshot 2024-08-27 at 2 54 39 PM

Step 4: Navigate Back to "All quadrants" view

Screenshot 2024-08-27 at 2 54 56 PM

Step 5: Zoom out again in order to produce the following observations.

Screenshot 2024-08-27 at 2 55 11 PM

Observation 1: When We zoom out we see that the radar has shifted off-centre

Screenshot 2024-08-27 at 2 55 37 PM

(Fix for this issue in Commit: 1) : [Zooming in and out after switching radar tabs, UI break fixed]

Observation 2: We can also notice that the footer has moved up behind the radar and is hidden by the radar.

Screenshot 2024-08-27 at 3 04 24 PM

(Fix for this issue in Commit: 2) : [Footer appearing behind the radar after zooming out, fixed]

View Post fix

Screenshot 2024-08-27 at 2 54 02 PM