Increase the size of top header and bottom text fields for touchscreens

[rinigus]

When testing on mobile, top header and text field on the bottom are somewhat small. While text size is fine as it is, it is hard to select the text field (or let's say harder than it should be). So, I suggest to make header and footer of the pages the same as the height of a single room delegate in list room pane. That size feels spot on.

The icons on buttons, in the header/footer, are fine in terms of the size. It's just that they would have to be centered vertically in the corresponding header/footer and the area allowing to select them should be made a bigger.

[mirukana]

You can preview what it would look like by typing theme.baseElementsHeight = 52 in the debug console (F1 by default, or set this to true), with some flaws right now. There should be an easier way to change it (when we'll have GUI settings), I think it looks bad on desktop though. If we can detect that the user is on a small touch screen, in these cases it could be a default.

I'll mark this as a bug for now until theme.baseElementsHeight's behavior is fixed.

[rinigus]

Looks like baseElementsHeight is changing room list as well, which is not intended. Also message text is not vertically centered in the bottom. But the size looks to be fine for me...

[mirukana]

baseElementsHeight especially controls the avatar heights, and UI parts like the composer or room header follow the avatar's size. The list delegates also follow it, but add some extra top/bottom padding... the avatar size should probably be made independent of baseElementsHeight.

[rinigus]

We can add identification of whether Mirage is running on mobile or not. See https://github.com/KDE/kirigami/blob/master/src/settings.cpp#L56 for how its done for Kirigami. Relevant part

#if defined(Q_OS_ANDROID) || defined(Q_OS_IOS)
    m_mobile = true;
    m_hasTouchScreen = true;
#else
    //Mostly for debug purposes and for platforms which are always mobile,
    //such as Plasma Mobile
    if (qEnvironmentVariableIsSet("QT_QUICK_CONTROLS_MOBILE")) {
        m_mobile = QByteArrayList{"1", "true"}.contains(qgetenv("QT_QUICK_CONTROLS_MOBILE"));
    } else {
        m_mobile = false;
    }

    for (const auto &device : QTouchDevice::devices()) {
        if (device->type() == QTouchDevice::TouchScreen) {
            m_hasTouchScreen = true;
            break;
        }
    }
    if (m_hasTouchScreen) {
        connect(qApp, &QGuiApplication::focusWindowChanged,
                this, [this](QWindow *win) {
                    if (win) {
                        win->installEventFilter(this);
                    }
                });
    }
#endif