Fix responsiveness of Links (QR) page

[NPDebs]

This PR fixes issue #638.
The page was not responsive on mobile and long texts were spilling out of their containers.
That has been fixed by adjusting the height of the buttons and wrapping texts.

The downside of this is that the buttons no longer have equal height, but I do not think this is a deal breaker.

Note for reviewers:
An alternative fix would be to set overflow to hidden, add display ellipsis (...) when text overflows and prevent text from wrapping with nowrap. The disadvantage is that users will not see some of the text.

.links {
    .button {
      display: inline-block; /* Make sure the button takes the width of its content */
      white-space: nowrap;
      overflow: hidden; /* Hide overflow text */
      text-overflow: ellipsis; /* Display ellipsis (...) when text overflows */
    }
  }
}

Thanks for taking the time to review! ❤️

[bebatut]

It does not work for me locally:

[netlify]

✅ Deploy Preview for ols-bebatut ready!

Name	Link
🔨 Latest commit	0e2ea25
🔍 Latest deploy log	https://app.netlify.com/sites/ols-bebatut/deploys/66a374698903990008d4cdaa
😎 Deploy Preview	https://deploy-preview-687--ols-bebatut.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[yochannah]

addressed in #860