diff --git a/DankKDEConnect/DankKDEConnect.qml b/DankKDEConnect/DankKDEConnect.qml index 12d6e43..3ef030c 100644 --- a/DankKDEConnect/DankKDEConnect.qml +++ b/DankKDEConnect/DankKDEConnect.qml @@ -1407,14 +1407,15 @@ PluginComponent { id: mainDeviceContainerRow width: parent.width height: { + const contentHeight = mainInfoColumn.implicitHeight + Theme.spacingM * 2; if (!root.showDevicePlaceholder) { - return mainInfoColumn.implicitHeight + Theme.spacingM * 2; + return contentHeight; } const type = root.activeDevice?.type; if (type === "desktop" || type === "computer" || type === "laptop" || type === "tablet" || type === "tv") { - return Math.max(mainInfoColumn.implicitHeight + Theme.spacingM * 2, 160); + return Math.max(contentHeight, 160); } - return 245; + return Math.max(contentHeight, 245); } spacing: Theme.spacingM visible: root.hasDevice diff --git a/DankKDEConnect/components/InfoRow.qml b/DankKDEConnect/components/InfoRow.qml index 143904a..c72c61b 100644 --- a/DankKDEConnect/components/InfoRow.qml +++ b/DankKDEConnect/components/InfoRow.qml @@ -13,7 +13,7 @@ RowLayout { property color valueColor: Theme.surfaceText spacing: Theme.spacingM - width: parent.width + Layout.fillWidth: true DIcon { name: root.icon @@ -28,17 +28,23 @@ RowLayout { Layout.alignment: Qt.AlignVCenter StyledText { + width: parent.width text: root.label font.pixelSize: Theme.fontSizeSmall color: Theme.surfaceVariantText font.weight: Font.Medium + wrapMode: Text.NoWrap + elide: Text.ElideRight } StyledText { + width: parent.width text: root.value font.pixelSize: Theme.fontSizeMedium color: root.valueColor font.weight: Font.Medium + wrapMode: Text.NoWrap + elide: Text.ElideRight } } } diff --git a/DankKDEConnect/components/KDEConnectDetailContent.qml b/DankKDEConnect/components/KDEConnectDetailContent.qml index ce19d8a..2dd9b8b 100644 --- a/DankKDEConnect/components/KDEConnectDetailContent.qml +++ b/DankKDEConnect/components/KDEConnectDetailContent.qml @@ -514,14 +514,15 @@ Item { id: detailDeviceContainerRow width: parent.width height: { + const contentHeight = detailInfoColumn.implicitHeight + Theme.spacingM * 2; if (!root.showDevicePlaceholder) { - return detailInfoColumn.implicitHeight + Theme.spacingM * 2; + return contentHeight; } const type = root.activeDevice?.type; if (type === "desktop" || type === "computer" || type === "laptop" || type === "tablet" || type === "tv") { - return Math.max(detailInfoColumn.implicitHeight + Theme.spacingM * 2, 160); + return Math.max(contentHeight, 160); } - return 255; + return Math.max(contentHeight, 255); } spacing: Theme.spacingM visible: root.hasDevice