Wt

There might not be a need to do things differently on mobile!
Just setting a reasonable max-size will do, especially for the built-in Registration Widget!

  // add to WDialog::create() at ~line 320
  setMaximumSize(WLength(90, LengthUnit::ViewportWidth), WLength(90, LengthUnit::ViewportHeight));
  contents_->setOverflow(Wt::Overflow::Auto, Wt::Orientation::Vertical);

If you wouldn't mind explaining how this solution would not work or be undesireable?
I'd appreciate it =)
Thanks

Just read in Bootstrap Documentation:

You can also create a scrollable modal that allows scrolling the modal body by adding .modal-dialog-scrollable to .modal-dialog.

<!-- Scrollable modal BS 5.3 -->
<div class="modal-dialog modal-dialog-scrollable">
  ...
</div>

With that alone, the problem is solved =)

https://getbootstrap.com/docs/5.3/components/modal/
https://getbootstrap.com/docs/5.2/components/modal/

I updated Bootstrap5Theme:

  case DomElementType::DIV: {
    auto dialog = dynamic_cast<WDialog *>(widget);
    if (dialog) {
      element.addPropertyWord(Property::Class, "modal modal-dialog modal-dialog-centered modal-dialog-scrollable Wt-dialog");
      return;
    }

and these styles need to be deactivated:

.Wt-dialog.modal {
  display: block;
  height: auto;
  width: auto;
}

which I did not look into for this small test. I just deactivated it in the browser console for testing

Registration Widget is now scrolling on mobile and therefore usable!

This way is also more portable than setting the maxSize in code, which was a terrible Idea.