diff --git a/src/qml/Base/HTabButton.qml b/src/qml/Base/HTabButton.qml new file mode 100644 index 00000000..a77e9661 --- /dev/null +++ b/src/qml/Base/HTabButton.qml @@ -0,0 +1,55 @@ +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import QtQuick.Layouts 1.12 + +TabButton { + id: button + spacing: theme.spacing + topPadding: spacing / 1.5 + bottomPadding: topPadding + leftPadding: spacing + rightPadding: leftPadding + + iconItem.svgName: loading ? "hourglass" : icon.name + icon.color: theme.icons.colorize + enabled: ! loading + + // Must be explicitely set to display correctly on KDE + implicitWidth: Math.max( + implicitBackgroundWidth + leftInset + rightInset, + // FIXME: why is *2 needed to not get ellided text in AddAccount page? + implicitContentWidth + leftPadding * 2 + rightPadding * 2, + ) + implicitHeight: Math.max( + implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + ) + + // Prevent button from gaining focus and being highlighted on click + focusPolicy: Qt.TabFocus + + + readonly property alias iconItem: contentItem.icon + readonly property alias label: contentItem.label + + property color backgroundColor: theme.controls.tab.background + property bool loading: false + + property HToolTip toolTip: HToolTip { + id: toolTip + visible: text && hovered + } + + + background: HButtonBackground { + button: button + buttonTheme: theme.controls.tab + color: backgroundColor + } + + contentItem: HButtonContent { + id: contentItem + button: button + buttonTheme: theme.controls.tab + } +} diff --git a/src/qml/Pages/AddChat/AddChat.qml b/src/qml/Pages/AddChat/AddChat.qml index 188c736d..451c6807 100644 --- a/src/qml/Pages/AddChat/AddChat.qml +++ b/src/qml/Pages/AddChat/AddChat.qml @@ -6,12 +6,11 @@ import "../../Base" HPage { onFocusChanged: createRoom.forceActiveFocus() - HBox { - id: rootBox - multiplyWidth: 1.11 - multiplyHorizontalSpacing: 0 - multiplyVerticalSpacing: 0 + HColumnLayout { Layout.alignment: Qt.AlignCenter + Layout.minimumWidth: Layout.maximumWidth + Layout.maximumWidth: + Math.max(tabBar.implicitWidth, swipeView.contentWidth) TabBar { id: tabBar @@ -27,7 +26,7 @@ HPage { qsTr("Join room"), ] - TabButton { + HTabButton { text: modelData } } @@ -35,6 +34,7 @@ HPage { SwipeView { + id: swipeView clip: true currentIndex: tabBar.currentIndex @@ -44,7 +44,6 @@ HPage { CreateRoom { id: createRoom - color: "transparent" } Item {} diff --git a/src/qml/Pages/AddChat/CreateRoom.qml b/src/qml/Pages/AddChat/CreateRoom.qml index 2d4c3c4a..c79b3763 100644 --- a/src/qml/Pages/AddChat/CreateRoom.qml +++ b/src/qml/Pages/AddChat/CreateRoom.qml @@ -18,7 +18,7 @@ HBox { HTextField { id: nameField - placeholderText: qsTr("Name (optional)") + placeholderText: qsTr("Name") Layout.fillWidth: true } @@ -33,7 +33,7 @@ HBox { HCheckBox { id: publicCheckBox text: qsTr("Make this room public") - subtitle.text: qsTr("Anyone can join without being invited") + subtitle.text: qsTr("Anyone will be able to join without invitation.") spacing: addChatBox.horizontalSpacing Layout.maximumWidth: parent.width @@ -43,7 +43,8 @@ HBox { id: encryptCheckBox text: qsTr("Encrypt messages") subtitle.text: - qsTr("Only you and users you trust will be able to read them") + + qsTr("Protect the room against eavesdropper. Only you " + + "and those you trust can read the conversation.") + "
" + qsTr("Cannot be disabled later!") + ""