Merge pull request #956 from maltee1/mobile_room_directory

Mobile room directory

resources/qml/dialogs/RoomDirectory.qml

@@ -16,8 +16,10 @@ ApplicationWindow {
     property RoomDirectoryModel publicRooms
 
     visible: true
-    minimumWidth: 650
+    minimumWidth: 340
-    minimumHeight: 420
+    minimumHeight: 340
+    height: 420
+    width: 650
     palette: Nheko.colors
     color: Nheko.colors.window
     modality: Qt.WindowModal
@@ -38,7 +40,6 @@ ApplicationWindow {
         ScrollHelper {
             flickable: parent
             anchors.fill: parent
-            enabled: !Settings.mobileMode
         }
 
         delegate: Rectangle {
@@ -47,7 +48,7 @@ ApplicationWindow {
             property color background: Nheko.colors.window
             property color importantText: Nheko.colors.text
             property color unimportantText: Nheko.colors.buttonText
-            property int avatarSize: fontMetrics.lineSpacing * 4
+            property int avatarSize: fontMetrics.height * 3.2
 
             color: background
             height: avatarSize + Nheko.paddingLarge
@@ -56,13 +57,14 @@ ApplicationWindow {
             RowLayout {
                 spacing: Nheko.paddingMedium
                 anchors.fill: parent
-                anchors.margins: Nheko.paddingLarge
+                anchors.margins: Nheko.paddingMedium
-                implicitHeight: textContent.height
+                implicitHeight: textContent.implicitHeight
 
                 Avatar {
                     id: roomAvatar
 
                     Layout.alignment: Qt.AlignVCenter
+                    Layout.rightMargin: Nheko.paddingMedium
                     width: avatarSize
                     height: avatarSize
                     url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
@@ -70,36 +72,31 @@ ApplicationWindow {
                     displayName: model.name
                 }
 
-                ColumnLayout {
+                GridLayout {
                     id: textContent
+                    rows: 2
+                    columns: 2
 
                     Layout.alignment: Qt.AlignLeft
                     width: parent.width - avatar.width
                     Layout.preferredWidth: parent.width - avatar.width
-                    spacing: Nheko.paddingSmall
 
                     ElidedLabel {
-                        Layout.alignment: Qt.AlignBottom
+                        Layout.row: 0
+                        Layout.column: 0
+                        Layout.fillWidth:true
                         color: roomDirDelegate.importantText
-                        elideWidth: textContent.width - numMembersRectangle.width - buttonRectangle.width
+                        elideWidth: width
-                        font.pixelSize: fontMetrics.font.pixelSize * 1.1
                         fullText: model.name
                     }
 
-                    RowLayout {
-                        id: roomDescriptionRow
-
-                        Layout.preferredWidth: parent.width
-                        spacing: Nheko.paddingSmall
-                        Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
-                        Layout.preferredHeight: fontMetrics.lineSpacing * 4
-
                     Label {
                         id: roomTopic
 
                         color: roomDirDelegate.unimportantText
-                            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+                        Layout.row: 1
-                            font.pixelSize: fontMetrics.font.pixelSize
+                        Layout.column: 0
+                        font.pointSize: fontMetrics.font.pointSize*0.9
                         elide: Text.ElideRight
                         maximumLineCount: 2
                         Layout.fillWidth: true
@@ -108,34 +105,22 @@ ApplicationWindow {
                         wrapMode: Text.WordWrap
                     }
 
-                        Item {
-                            id: numMembersRectangle
-
-                            Layout.margins: Nheko.paddingSmall
-                            width: roomCount.width
-
                     Label {
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.row: 0
+                        Layout.column: 1
                         id: roomCount
 
                         color: roomDirDelegate.unimportantText
-                                anchors.centerIn: parent
+                        font.pointSize: fontMetrics.font.pointSize*0.9
-                                font.pixelSize: fontMetrics.font.pixelSize
                         text: model.numMembers.toString()
                     }
 
-                        }
-
-                        Item {
-                            id: buttonRectangle
-
-                            Layout.margins: Nheko.paddingSmall
-                            width: joinRoomButton.width
-
                     Button {
+                        Layout.row: 1
+                        Layout.column: 1
                         id: joinRoomButton
-
+                        enabled: model.canJoin
-                                visible: model.canJoin
-                                anchors.centerIn: parent
                         text: "Join"
                         onClicked: publicRooms.joinRoom(model.index)
                     }
@@ -146,10 +131,6 @@ ApplicationWindow {
 
         }
 
-            }
-
-        }
-
         footer: Item {
             anchors.horizontalCenter: parent.horizontalCenter
             width: parent.width