mobile/UI: small adjustments, using the slim combo box

This changes most readonly combo boxes to use the smaller, more modern
looking TemplateSlimComboBox and makes some layout adjustments on a few
pages to overall create a better UI.

A lot of this is just cleaning up things that were rather rough in the
first place.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

3 files changed, 14 insertions, 13 deletions

diff --git a/mobile-widgets/qml/DiveList.qml b/mobile-widgets/qml/DiveList.qml
index 3e51a771b..cf532fa13 100644
--- a/mobile-widgets/qml/DiveList.qml
+++ b/mobile-widgets/qml/DiveList.qml
@@ -386,17 +386,15 @@ Kirigami.ScrollablePage {
 			anchors.right: parent.right
 			anchors.leftMargin: Kirigami.Units.gridUnit / 2
 			anchors.rightMargin: Kirigami.Units.gridUnit / 2
-			TemplateComboBox {
+			TemplateSlimComboBox {
 				visible: filterBar.height === sitefilter.implicitHeight
 				id: sitefilterMode
-				editable: false
 				model: ListModel {
 					ListElement {text: qsTr("Fulltext")}
 					ListElement {text: qsTr("People")}
 					ListElement {text: qsTr("Tags")}
 				}
 				font.pointSize: subsurfaceTheme.smallPointSize
-				Layout.preferredWidth: parent.width * 0.2
 				Layout.maximumWidth: parent.width * 0.3
 				onActivated:  {
 					manager.setFilter(sitefilter.text, currentIndex)
diff --git a/mobile-widgets/qml/DiveSummary.qml b/mobile-widgets/qml/DiveSummary.qml
index 8fa9601da..1e4d512ad 100644
--- a/mobile-widgets/qml/DiveSummary.qml
+++ b/mobile-widgets/qml/DiveSummary.qml
@@ -12,7 +12,7 @@ Kirigami.ScrollablePage {
 	DiveSummaryModel { id: summaryModel }
 	property string firstDive: ""
 	property string lastDive: ""
-	property int headerColumnWidth: Math.floor(width / 3)
+	property int headerColumnWidth: Math.floor((width - Kirigami.Units.gridUnit) / 3)
 
 	background: Rectangle { color: subsurfaceTheme.backgroundColor }
 	title: qsTr("Dive summary")
@@ -83,12 +83,13 @@ Kirigami.ScrollablePage {
 		TemplateButton {
 			/* Replace by signals from the core in due course. */
 			text: qsTr("Refresh")
-			implicitWidth: headerColumnWidth
+			implicitWidth: headerColumnWidth - Kirigami.Units.largeSpacing
 			onClicked: reload()
 		}
-		TemplateComboBox {
+		TemplateSlimComboBox {
 			id: selectionPrimary
-			editable: false
+			Layout.maximumWidth: headerColumnWidth - Kirigami.Units.largeSpacing
+			Layout.preferredWidth: headerColumnWidth - Kirigami.Units.largeSpacing
 			currentIndex: 0
 			model: monthModel
 			font.pointSize: subsurfaceTheme.smallPointSize
@@ -96,9 +97,10 @@ Kirigami.ScrollablePage {
 				summaryModel.calc(0, currentIndex)
 			}
 		}
-		TemplateComboBox {
+		TemplateSlimComboBox {
 			id: selectionSecondary
-			editable: false
+			Layout.maximumWidth: headerColumnWidth - Kirigami.Units.largeSpacing
+			Layout.preferredWidth: headerColumnWidth - Kirigami.Units.largeSpacing
 			currentIndex: 3
 			model: monthModel
 			font.pointSize: subsurfaceTheme.smallPointSize
@@ -110,6 +112,7 @@ Kirigami.ScrollablePage {
 		Component {
 			id: rowDelegate
 			Row {
+				Layout.leftMargin: 0
 				height: headerLabel.height + Kirigami.Units.largeSpacing
 				Rectangle {
 					width: Kirigami.Units.gridUnit
@@ -131,7 +134,7 @@ Kirigami.ScrollablePage {
 				}
 				Rectangle {
 					color: index & 1 ? subsurfaceTheme.backgroundColor : subsurfaceTheme.lightPrimaryColor
-					width: headerColumnWidth - 2 * Kirigami.Units.gridUnit
+					width: headerColumnWidth - 1.5 * Kirigami.Units.gridUnit
 					height: headerLabel.height + Kirigami.Units.largeSpacing
 					Label {
 						color: subsurfaceTheme.textColor
@@ -141,7 +144,7 @@ Kirigami.ScrollablePage {
 				}
 				Rectangle {
 					color: index & 1 ? subsurfaceTheme.backgroundColor : subsurfaceTheme.lightPrimaryColor
-					width: headerColumnWidth - 2 * Kirigami.Units.gridUnit
+					width: headerColumnWidth - 1.5 * Kirigami.Units.gridUnit
 					height: headerLabel.height + Kirigami.Units.largeSpacing
 					Label {
 						color: subsurfaceTheme.textColor
diff --git a/mobile-widgets/qml/Settings.qml b/mobile-widgets/qml/Settings.qml
index 271577eae..3d28bec2a 100644
--- a/mobile-widgets/qml/Settings.qml
+++ b/mobile-widgets/qml/Settings.qml
@@ -81,7 +81,7 @@ TemplatePage {
 				TemplateLabel {
 					text: qsTr("Cylinder:")
 				}
-				TemplateComboBox {
+				TemplateSlimComboBox {
 					id: defaultCylinderBox
 					Layout.fillWidth: true
 					onActivated: {
@@ -145,7 +145,7 @@ TemplatePage {
 					Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
 					Layout.columnSpan: 2
 				}
-				TemplateComboBox {
+				TemplateSlimComboBox {
 					editable: false
 					Layout.columnSpan: 2
 					currentIndex: (subsurfaceTheme.currentTheme === "Blue") ? 0 :