Flex gap is not supported on MacOS 10.15 Catalina's WebKit

[Malien]

Please confirm the following.

• I checked the existing issues for duplicate problems
• I have tried resolving the issue using the support portal
• I have ensured my Modrinth App installation is up to date

What version of the Modrinth App are you using?

0.8.7 (20240910.081136)

What operating systems are you seeing the problem on?

MacOS

Describe the bug

From my preliminary stroll, the Modrinth app seems to liberaly use gap property with flex containers to specify padding. In the modern world this is a super nice feature to have. Since Modrinth app is shipped via tauri, which utilizes OS'es built in webview (WKWebView) to render the UI, we are stuck with the WebKit version shipped with the operating system (as opposed to electron, which ships it's own chromium build in every packaged app).

Even though, MacOS 10.15 Catalina can run, pretty capable, Safari 15.6, it is not shipped with it. OS SDK includes WebKit 609.4.1, which is roughly equivalent to Safari 13.1. Safari 13.1 doesn't support gap for flex layout (it does for the grid though)

This leaves the UI in usable, but pretty ugly state:

macOS 10.15 (and to better extent 10.13) is the last officially supported OS version for a VAST amount of Apple's hardware. The team might have not considered the minimal supported OS version. Even though I bring this issue to the light the last thing I would've wanted is for Modrinth to lock out old OS'es from launching the app. Even this somewhat broken state is still plenty usable.

Instead I would like to contribute my own time and effort to "backport" gaps and paddings to use more widely available primitives. If that is ok with the team, and the maintenance burden isn't too big, I'd like to shoot a couple of PRs in a short while.

Steps to reproduce

No response

Expected behavior

No response

Additional context

No response