diff --git a/qml/components/MessageListViewItem.qml b/qml/components/MessageListViewItem.qml index 8de7e7c..5ff54d8 100644 --- a/qml/components/MessageListViewItem.qml +++ b/qml/components/MessageListViewItem.qml @@ -128,6 +128,10 @@ ListItem { selectReactionBubble.visible = false; } + function getContentWidthMultiplier() { + return Functions.isTablet(appWindow) ? 0.4 : 1.0 + } + onClicked: { if (messageListItem.precalculatedValues.pageIsSelecting) { page.toggleMessageSelection(myMessage); @@ -365,8 +369,10 @@ ListItem { id: messageTextRow spacing: Theme.paddingSmall width: precalculatedValues.entryWidth - anchors.horizontalCenter: parent.horizontalCenter + anchors.horizontalCenter: Functions.isTablet(appWindow) ? undefined : parent.horizontalCenter + anchors.left: Functions.isTablet(appWindow) ? parent.left : undefined y: Theme.paddingSmall + anchors.leftMargin: Functions.isTablet(appWindow) ? Theme.paddingMedium : undefined Loader { id: profileThumbnailLoader @@ -596,7 +602,7 @@ ListItem { id: webPagePreviewLoader active: false asynchronous: true - width: parent.width + width: parent.width * getContentWidthMultiplier() height: (status === Loader.Ready) ? item.implicitHeight : myMessage.content.web_page ? precalculatedValues.webPagePreviewHeight : 0 sourceComponent: Component { @@ -610,7 +616,7 @@ ListItem { Loader { id: extraContentLoader - width: parent.width + width: parent.width * getContentWidthMultiplier() asynchronous: true height: item ? item.height : (messageListItem.hasContentComponent ? chatView.getContentComponentHeight(model.content_type, myMessage.content, width) : 0) } diff --git a/qml/components/settingsPage/ResponsiveGrid.qml b/qml/components/settingsPage/ResponsiveGrid.qml index 1d1bb55..8caf663 100644 --- a/qml/components/settingsPage/ResponsiveGrid.qml +++ b/qml/components/settingsPage/ResponsiveGrid.qml @@ -19,9 +19,10 @@ import QtQuick 2.6 import Sailfish.Silica 1.0 +import "../../js/functions.js" as Functions Grid { width: parent.width - ( 2 * x ) - columns: (appWindow.deviceOrientation & Orientation.LandscapeMask) || Screen.sizeCategory === Screen.Large || Screen.sizeCategory === Screen.ExtraLarge ? 2 : 1 + columns: Functions.isTablet(appWindow) ? 2 : 1 readonly property real columnWidth: width/columns } diff --git a/qml/js/functions.js b/qml/js/functions.js index b2e2ca7..e1c2634 100644 --- a/qml/js/functions.js +++ b/qml/js/functions.js @@ -540,3 +540,7 @@ function getMessagesNeededForwardPermissions(messages) { } return neededPermissions } + +function isTablet(appWindow) { + return (appWindow.deviceOrientation & Silica.Orientation.LandscapeMask) || Silica.Screen.sizeCategory === Silica.Screen.Large || Silica.Screen.sizeCategory === Silica.Screen.ExtraLarge +} diff --git a/qml/pages/ChatPage.qml b/qml/pages/ChatPage.qml index c7b1a73..41ad784 100644 --- a/qml/pages/ChatPage.qml +++ b/qml/pages/ChatPage.qml @@ -1193,7 +1193,7 @@ Page { readonly property int profileThumbnailDimensions: showUserInfo ? Theme.itemSizeSmall : 0 readonly property int pageMarginDouble: 2 * Theme.horizontalPageMargin readonly property int paddingMediumDouble: 2 * Theme.paddingMedium - readonly property int entryWidth: chatView.width - pageMarginDouble + readonly property int entryWidth: Functions.isTablet(appWindow) ? chatView.width * 0.75 : chatView.width - pageMarginDouble readonly property int textItemWidth: entryWidth - profileThumbnailDimensions - Theme.paddingSmall readonly property int backgroundWidth: page.isChannel ? textItemWidth : textItemWidth - pageMarginDouble readonly property int backgroundRadius: textItemWidth/50