feat (new-widget): default view

[julianpoma]

Default and general look of the new widget. This are only styles improvements, functionality might be broken (country selector not working properly, etc)

• Mobile & desktop layout
• Widget height varies with the content and the options turned on/off
• Nonprofit description with expandable content
• New frequency selector styles
• New input styles
• New tax residency styles
• Close button
• Closes #254

[vercel[bot]]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/everydotorg/donate-button/5w4WTpXqLXK5FTv1H67JpxLumxHS
✅ Preview: https://donate-button-git-jp-general-layout-everydotorg.vercel.app

[micamastro]

Can we increase the tap target of the expandable description in mobile?

Currently you can only tap on the blue rectangle. Can we make it possible to tap anywhere on the red rectangle?

[julianpoma]

@markulrich This is because the config from livebetter does not specify a value for crypto, which defaults to crypto = false. In the previous version I think that we were not using this value, and now we are.

Either we set crypto = true on the default configuration, or I ignore the value

The same will happen with showInputButtons. And now is set to true

[markulrich]

@julianpoma not sure I understand, I thought the crypto option was for a button that only works for crypto? Eg at https://donate-button-git-jp-general-layout-everydotorg.vercel.app/0.3

We could add some config showAlternatePayments that defaults to true so that livebetter will still have:

[julianpoma]

@markulrich yes, but we also have a crypto option on the default configuration for the widget, that has not been used anywhere. Probably a mistake and oversight. I saw it and thought it could be used to disable the section of or donate with: crypto daf stocks. Basically it has the same role as your showAlternatePayments. I can rename crypto => showAlternatePayments easily, and default it to true like you said.

Now, this is crashing with what you have commented in #259, where this section should be shown if the current selected country supports it. What should we do in this case? Because livebetter has not set countries in their configuration.

[markulrich]

After deploying, please check that https://livebetter.io/ is working as expected

[markulrich]

@julianpoma when can this land?

[julianpoma]

@markulrich I will merge this to the widget-design-updates branch, we can continue the discussion there.