We should definitely do something about this! It might be part of getting the whole form template away from table layout.

fr-tech would definitely accept volunteer CSS help on this one.

Hey @Ejegg, I would like to offer help here. Could you invite me the repo or send me the link to where I can find the files? Please let me know if there's something else that I need to know. I'm also up for an onboarding call if that's easier for you. Thanks!

Hi @schoenbaechler, thanks so much for the offer!

We're working in gerrit, like most of the WMF teams. If you're not set up in gerrit yet, this page is a good place to start: https://www.mediawiki.org/wiki/Gerrit/Getting_started.

The payment forms are provided by a mediawiki extension called DonationInterface.

The easiest way to get started with DonationInterface is probably via vagrant: https://www.mediawiki.org/wiki/Fundraising_tech#Installing_the_software_stack

If you've already got a mediawiki instance running and you'd like to avoid the overhead of a virtual machine, you can also check out the extension with

git clone ssh://<username>@gerrit.wikimedia.org:29418/mediawiki/extensions/DonationInterface.git

The forms are built with a nested bunch of mustache templates, all in this directory (link to github for convenience)
https://github.com/wikimedia/mediawiki-extensions-DonationInterface/tree/master/gateway_forms/mustache
The top-level one is index.html.mustache

You can see we're still using table layout for the forms. I guess some kind of responsive grid would be the way forward?

Let me know how far you get with these instructions. I'd be happy to jump on a call to clear things up, or you can usually find me on IRC as ejegg in # wikimedia-fundraising