Tools Page Table mobile Adjustments

[idanidan29]

What kind of change does this PR introduce?

This PR will adjust the tables on the tools page for mobile and improve the desktop table to prevent it from being cut off, ensuring users don't need to scroll sideways to view the full length of the table.

Issue Number:

• Closes 🐛 Bug: Tools Page Tables Require Adjusting #1442

Screenshots/videos:

Summary
I think this is a necessary change, as it will improve the readability of the tools on the page.

Does this PR introduce a breaking change?
no

[github-actions]

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name	Status	Preview	Last Commit
website	✅ Ready (View Log)	Visit Preview	0ed2015

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (60f2d6a) to head (0ed2015).
Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##              main     #1473   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           10        10           
  Lines          396       396           
  Branches       106       106           
=========================================
  Hits           396       396           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[DhairyaMajmudar]

@idanidan29 we're loosing table headers with this new design, is there any solution for that?

[idanidan29]

@DhairyaMajmudar Yes, that's the intended design. It was also suggested in the issue, as keeping the headers would make it too dense, small, and hard to read. But we could add an example card with all the fields labeled by their names at the start, it might work better. i would like to hear your opinion on this

[DhairyaMajmudar]

@DhairyaMajmudar Yes, that's the intended design. It was also suggested in the issue, as keeping the headers would make it too dense, small, and hard to read. But we could add an example card with all the fields labeled by their names at the start, it might work better. i would like to hear your opinion on this

Remvoing table header won't be a good idea as it will be difficult for user to know what fields are related to which tag, the changes which you're suggesting is also not so optimal as it will add and empty/dummy card. Pls. suggest some more ideas.