port to Kirigami imports and new api

first quick and dirty port of the imports to Kirigami 1.0
(using system installed for now) adapt to api changes and
try out some of the proposed ui changes from the HIG

Signed-off-by: Marco Martin <notmart@gmail.com>

qt-mobile/qml/About.qml

@@ -1,24 +1,22 @@
 import QtQuick 2.3
 import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.1
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
-MobileComponents.Page {
+Kirigami.ScrollablePage {
 	id: aboutPage
-	property int pageWidth: subsurfaceTheme.columnWidth - MobileComponents.Units.gridUnit
+	property int pageWidth: subsurfaceTheme.columnWidth - Kirigami.Units.gridUnit
-
+	title: "About Subsurface-mobile"
-	ScrollView {
-		anchors.fill: parent
 
 	ColumnLayout {
-			spacing: MobileComponents.Units.largeSpacing
+		spacing: Kirigami.Units.largeSpacing
 		width: aboutPage.width
-			Layout.margins: MobileComponents.Units.gridUnit / 2
+		Layout.margins: Kirigami.Units.gridUnit / 2
 
-			MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "About Subsurface-mobile"
-				Layout.margins: MobileComponents.Units.largeSpacing / 2
+			Layout.margins: Kirigami.Units.largeSpacing / 2
 			Layout.alignment: Qt.AlignHCenter
 			Layout.maximumWidth: pageWidth
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -26,41 +24,40 @@ MobileComponents.Page {
 
 		Rectangle {
 			color: "transparent"
-				Layout.margins: MobileComponents.Units.largeSpacing
+			Layout.margins: Kirigami.Units.largeSpacing
 			Layout.fillWidth: true
-				height: childrenRect.height
+			Layout.minimumHeight: childrenRect.height
 			Image {
 				id: image
 				source: "qrc:/qml/subsurface-mobile-icon.png"
-					width: parent.width - MobileComponents.Units.largeSpacing
+				width: parent.width - Kirigami.Units.largeSpacing
 				fillMode: Image.PreserveAspectFit
 				horizontalAlignment: Image.AlignHCenter
 			}
 		}
 
-			MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "A mobile version of the free Subsurface divelog software.\n" +
 				"View your dive logs while on the go."
 			level: 4
 			Layout.alignment: Qt.AlignHCenter
-				Layout.topMargin: MobileComponents.Units.largeSpacing * 3
+			Layout.topMargin: Kirigami.Units.largeSpacing * 3
 			Layout.maximumWidth: pageWidth
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 			anchors.horizontalCenter: parent.Center
 			horizontalAlignment: Text.AlignHCenter
 		}
 
-			MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Version: " + manager.getVersion() + "\n\n© Subsurface developer team\n2011-2016"
 			level: 5
 			font.pointSize: subsurfaceTheme.smallPointSize + 1
 			Layout.alignment: Qt.AlignHCenter
-				Layout.topMargin: MobileComponents.Units.largeSpacing
+			Layout.topMargin: Kirigami.Units.largeSpacing
 			Layout.maximumWidth: pageWidth
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 			anchors.horizontalCenter: parent.Center
 			horizontalAlignment: Text.AlignHCenter
 		}
 	}
-	}
 }

qt-mobile/qml/CloudCredentials.qml

@@ -3,12 +3,12 @@ import QtQuick.Controls 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
 Item {
 	id: loginWindow
-	height: outerLayout.height + 2 * MobileComponents.Units.gridUnit
+	height: outerLayout.height + 2 * Kirigami.Units.gridUnit
 
 	property string username: login.text;
 	property string password: password.text;
@@ -23,14 +23,14 @@ Item {
 
 	ColumnLayout {
 		id: outerLayout
-		width: subsurfaceTheme.columnWidth - 2 * MobileComponents.Units.gridUnit
+		width: subsurfaceTheme.columnWidth - 2 * Kirigami.Units.gridUnit
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Cloud credentials"
 			level: headingLevel
-			Layout.bottomMargin: MobileComponents.Units.largeSpacing / 2
+			Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Email"
 		}
 
@@ -42,7 +42,7 @@ Item {
 					  Qt.ImhNoAutoUppercase
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Password"
 		}
 
@@ -65,7 +65,7 @@ Item {
 					password.echoMode = checked ? TextInput.Normal : TextInput.Password
 				}
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				text: "Show password"
 			}
 
@@ -73,10 +73,10 @@ Item {
 				checked: manager.saveCloudPassword
 				id: savePassword
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				text: "Remember"
 			}
 		}
-		Item { width: MobileComponents.Units.gridUnit; height: width }
+		Item { width: Kirigami.Units.gridUnit; height: width }
 	}
 }

qt-mobile/qml/DiveDetails.qml

@@ -4,9 +4,9 @@ import QtQuick.Controls.Styles 1.4
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.2
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.Page {
+Kirigami.Page {
 	id: diveDetailsPage
 	property alias currentIndex: diveDetailsListView.currentIndex
 	property alias dive_id: detailsEdit.dive_id
@@ -26,26 +26,30 @@ MobileComponents.Page {
 	property alias endpressure: detailsEdit.endpressureText
 	property alias gasmix: detailsEdit.gasmixText
 
+	topPadding: applicationWindow().header.Layout.preferredHeight
+	leftPadding: 0
+	rightPadding: 0
+	bottomPadding: 0
+
+	title: diveDetailsListView.currentItem.modelData.dive.location
 	state: "view"
+	flickable: diveDetailsListView.currentItem
 
 	states: [
 		State {
 			name: "view"
 			PropertyChanges { target: diveDetailsPage; contextualActions: deleteAction }
-			PropertyChanges { target: diveDetailList; visible: true }
+			PropertyChanges { target: detailsEditScroll; opened: false }
-			PropertyChanges { target: detailsEditScroll; visible: false }
 		},
 		State {
 			name: "edit"
 			PropertyChanges { target: diveDetailsPage; contextualActions: null }
-			PropertyChanges { target: diveDetailList; visible: false }
+			PropertyChanges { target: detailsEditScroll; opened: true }
-			PropertyChanges { target: detailsEditScroll; visible: true }
 		},
 		State {
 			name: "add"
 			PropertyChanges { target: diveDetailsPage; contextualActions: null }
-			PropertyChanges { target: diveDetailList; visible: false }
+			PropertyChanges { target: detailsEditScroll; opened: true }
-			PropertyChanges { target: detailsEditScroll; visible: true }
 		}
 
 	]
@@ -58,7 +62,7 @@ MobileComponents.Page {
 	}
 
 	property list<QtObject> deleteAction: [
-		Action {
+		Kirigami.Action {
 			text: "Delete dive"
 			iconName: "trash-empty"
 			onTriggered: {
@@ -146,6 +150,8 @@ MobileComponents.Page {
 
 	onWidthChanged: diveDetailsListView.positionViewAtIndex(diveDetailsListView.currentIndex, ListView.Beginning);
 
+	Item {
+		anchors.fill: parent
 		ScrollView {
 			id: diveDetailList
 			anchors.fill: parent
@@ -180,16 +186,17 @@ MobileComponents.Page {
 				}
 			}
 		}
-	Flickable {
+		Kirigami.OverlaySheet {
 			id: detailsEditScroll
 			anchors.fill: parent
-		anchors.margins: MobileComponents.Units.gridUnit
+			onOpenedChanged: {
-		contentWidth: contentItem.childrenRect.width;
+				if (!opened) {
-		contentHeight: contentItem.childrenRect.height
+					diveDetailsPage.state = "view"
-		clip: true
+				}
-		bottomMargin: MobileComponents.Units.gridUnit * 3
+			}
 			DiveDetailsEdit {
 				id: detailsEdit
 			}
 		}
+	}
 }

qt-mobile/qml/DiveDetailsEdit.qml

@@ -4,7 +4,7 @@ import QtQuick.Controls.Styles 1.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
 Item {
 	id: detailsEdit
@@ -59,19 +59,19 @@ Item {
 	height: editArea.height
 	ColumnLayout {
 		id: editArea
-		spacing: MobileComponents.Units.smallSpacing
+		spacing: Kirigami.Units.smallSpacing
-		width: subsurfaceTheme.columnWidth - 2 * MobileComponents.Units.gridUnit
+		width: subsurfaceTheme.columnWidth - 2 * Kirigami.Units.gridUnit
 
 		GridLayout {
 			id: editorDetails
 			width: parent.width
 			columns: 2
 
-			MobileComponents.Heading {
+			Kirigami.Heading {
 				Layout.columnSpan: 2
 				text: "Dive " + number
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Date:"
 			}
@@ -79,7 +79,7 @@ Item {
 				id: txtDate;
 				Layout.fillWidth: true
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Location:"
 			}
@@ -92,7 +92,7 @@ Item {
 			// to add the current location as the dive location
 			// (think of someone adding a dive while on the boat or
 			//  at the dive site)
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Use current\nGPS location:"
 			}
@@ -104,7 +104,7 @@ Item {
 				}
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Depth:"
 			}
@@ -113,7 +113,7 @@ Item {
 				Layout.fillWidth: true
 				validator: RegExpValidator { regExp: /[^-]*/ }
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Duration:"
 			}
@@ -123,7 +123,7 @@ Item {
 				validator: RegExpValidator { regExp: /[^-]*/ }
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Air Temp:"
 			}
@@ -132,7 +132,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Water Temp:"
 			}
@@ -141,7 +141,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Suit:"
 			}
@@ -150,7 +150,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Buddy:"
 			}
@@ -159,7 +159,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Dive Master:"
 			}
@@ -168,7 +168,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Weight:"
 			}
@@ -178,7 +178,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Gas mix:"
 			}
@@ -189,7 +189,7 @@ Item {
 				validator: RegExpValidator { regExp: /(EAN100|EAN\d\d|AIR|100|\d{1,2}|\d{1,2}\/\d{1,2})/ }
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "Start Pressure:"
 			}
@@ -199,7 +199,7 @@ Item {
 				Layout.fillWidth: true
 			}
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.alignment: Qt.AlignRight
 				text: "End Pressure:"
 			}
@@ -210,7 +210,7 @@ Item {
 			}
 
 
-			MobileComponents.Label {
+			Kirigami.Label {
 				Layout.columnSpan: 2
 				Layout.alignment: Qt.AlignLeft
 				text: "Notes:"
@@ -223,13 +223,13 @@ Item {
 				focus: true
 				Layout.fillWidth: true
 				Layout.fillHeight: true
-				Layout.minimumHeight: MobileComponents.Units.gridUnit * 6
+				Layout.minimumHeight: Kirigami.Units.gridUnit * 6
 				selectByMouse: true
 				wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 			}
 		}
 		Item {
-			height: MobileComponents.Units.gridUnit * 3
+			height: Kirigami.Units.gridUnit * 3
 			width: height // just to make sure the spacer doesn't produce scrollbars, but also isn't null
 		}
 	}

qt-mobile/qml/DiveDetailsView.qml

@@ -7,23 +7,23 @@ import QtQuick.Controls.Styles 1.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
 Item {
 	id: detailsView
-	property real gridWidth: subsurfaceTheme.columnWidth - 2 * MobileComponents.Units.gridUnit
+	property real gridWidth: subsurfaceTheme.columnWidth - 2 * Kirigami.Units.gridUnit
 	property real col1Width: gridWidth * 0.23
 	property real col2Width: gridWidth * 0.37
 	property real col3Width: gridWidth * 0.20
 	property real col4Width: gridWidth * 0.20
 
 	width: SubsurfaceTheme.columnWidth
-	height: mainLayout.implicitHeight + bottomLayout.implicitHeight + MobileComponents.Units.iconSizes.large
+	height: mainLayout.implicitHeight + bottomLayout.implicitHeight + Kirigami.Units.iconSizes.large
 	Rectangle {
 	    z: 99
-		color: MobileComponents.Theme.textColor
+		color: Kirigami.Theme.textColor
 		opacity: 0.3
-		width: MobileComponents.Units.smallSpacing/4
+		width: Kirigami.Units.smallSpacing/4
 		anchors {
 			right: parent.right
 			top: parent.top
@@ -36,13 +36,13 @@ Item {
 		    top: parent.top
 		    left: parent.left
 		    right: parent.right
-		    margins: Math.round(MobileComponents.Units.gridUnit / 2)
+		    margins: Math.round(Kirigami.Units.gridUnit / 2)
 		}
 		columns: 4
-		rowSpacing: MobileComponents.Units.smallSpacing * 2
+		rowSpacing: Kirigami.Units.smallSpacing * 2
-		columnSpacing: MobileComponents.Units.smallSpacing
+		columnSpacing: Kirigami.Units.smallSpacing
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			id: detailsViewHeading
 			Layout.fillWidth: true
 			text: dive.location
@@ -57,41 +57,41 @@ Item {
 				}
 			}
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: dateLabel
 			text: "Date: "
 			opacity: 0.6
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: dive.date + " " + dive.time
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 			Layout.columnSpan: 2
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: numberText
 			text: "#" + dive.number
-			color: MobileComponents.Theme.textColor
+			color: Kirigami.Theme.textColor
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: depthLabel
 			text: "Depth: "
 			opacity: 0.6
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: dive.depth
 			Layout.fillWidth: true
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Duration: "
 			opacity: 0.6
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: dive.duration
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
 		}
@@ -104,21 +104,21 @@ Item {
 			Layout.minimumHeight: width * 0.75
 			Layout.columnSpan: 4
 			clip: false
-			devicePixelRatio: MobileComponents.Units.devicePixelRatio
+			devicePixelRatio: Kirigami.Units.devicePixelRatio
 			Rectangle {
 				color: "transparent"
 				opacity: 0.6
 				border.width: 1
-				border.color: MobileComponents.Theme.textColor;
+				border.color: Kirigami.Theme.textColor;
 				anchors.fill: parent
 			}
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: noProfile
 			visible: dive.noDive
 			Layout.fillWidth: true
 			Layout.columnSpan: 4
-			Layout.margins: MobileComponents.Units.gridUnit
+			Layout.margins: Kirigami.Units.gridUnit
 			horizontalAlignment: Text.AlignHCenter
 			text: "No profile to show"
 		}
@@ -129,13 +129,13 @@ Item {
 		    top: mainLayout.bottom
 		    left: parent.left
 		    right: parent.right
-		    margins: Math.round(MobileComponents.Units.gridUnit / 2)
+		    margins: Math.round(Kirigami.Units.gridUnit / 2)
 		}
 		columns: 4
-		rowSpacing: MobileComponents.Units.smallSpacing * 2
+		rowSpacing: Kirigami.Units.smallSpacing * 2
-		columnSpacing: MobileComponents.Units.smallSpacing
+		columnSpacing: Kirigami.Units.smallSpacing
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			Layout.fillWidth: true
 			level: 3
 			text: "Dive Details"
@@ -143,7 +143,7 @@ Item {
 		}
 
 		// first row - here we set up the column widths - total is 90% of width
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Suit:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -151,7 +151,7 @@ Item {
 			Layout.preferredWidth: detailsView.col1Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtSuit
 			text: dive.suit
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -159,7 +159,7 @@ Item {
 			Layout.preferredWidth: detailsView.col2Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Air Temp:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -167,7 +167,7 @@ Item {
 			Layout.preferredWidth: detailsView.col3Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtAirTemp
 			text: dive.airTemp
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -175,7 +175,7 @@ Item {
 			Layout.preferredWidth: detailsView.col4Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Cylinder:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -183,7 +183,7 @@ Item {
 			Layout.preferredWidth: detailsView.col1Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtCylinder
 			text: dive.getCylinder
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -191,7 +191,7 @@ Item {
 			Layout.preferredWidth: detailsView.col2Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Water Temp:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -199,7 +199,7 @@ Item {
 			Layout.preferredWidth: detailsView.col3Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtWaterTemp
 			text: dive.waterTemp
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -207,7 +207,7 @@ Item {
 			Layout.preferredWidth: detailsView.col4Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Dive Master:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -215,7 +215,7 @@ Item {
 			Layout.preferredWidth: detailsView.col1Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtDiveMaster
 			text: dive.divemaster
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -223,7 +223,7 @@ Item {
 			Layout.preferredWidth: detailsView.col2Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Weight:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -231,7 +231,7 @@ Item {
 			Layout.preferredWidth: detailsView.col3Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtWeight
 			text: dive.sumWeight
 			wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
@@ -239,7 +239,7 @@ Item {
 			Layout.preferredWidth: detailsView.col4Width
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Buddy:"
 			wrapMode: Text.WrapAtWordBoundaryOrAnywhere
 			opacity: 0.6
@@ -247,7 +247,7 @@ Item {
 			Layout.preferredWidth: detailsView.col1Width
 			Layout.alignment: Qt.AlignRight
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtBuddy
 			text: dive.buddy
 			Layout.columnSpan: 3
@@ -256,7 +256,7 @@ Item {
 			Layout.preferredWidth: detailsView.col2Width + detailsView.col3Width + detailsView.col4Width
 		}
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			Layout.fillWidth: true
 			level: 3
 			text: "Notes"
@@ -264,7 +264,7 @@ Item {
 			Layout.columnSpan: 4
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			id: txtNotes
 			text: dive.notes
 			focus: true
@@ -277,10 +277,10 @@ Item {
 		Item {
 			Layout.columnSpan: 4
 			Layout.fillWidth: true
-			Layout.minimumHeight: MobileComponents.Units.gridUnit * 3
+			Layout.minimumHeight: Kirigami.Units.gridUnit * 3
 		}
 		Component.onCompleted: {
-			qmlProfile.setMargin(MobileComponents.Units.smallSpacing)
+			qmlProfile.setMargin(Kirigami.Units.smallSpacing)
 			qmlProfile.diveId = model.dive.id;
 			qmlProfile.update();
 		}

qt-mobile/qml/DiveList.qml

@@ -3,26 +3,30 @@ import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
-MobileComponents.Page {
+Kirigami.ScrollablePage {
 	id: page
 	objectName: "DiveList"
-	color: MobileComponents.Theme.viewBackgroundColor
+        title: "Subsurface-mobile"
+	background: Rectangle {
+		color: Kirigami.Theme.viewBackgroundColor
+	}
 
 	property int credentialStatus: manager.credentialStatus
 	property int numDives: diveListView.count
 
 	Component {
 		id: diveDelegate
-		MobileComponents.ListItem {
+		Kirigami.AbstractListItem {
 			enabled: true
+			supportsMouseEvents: true
 			checked: diveListView.currentIndex === model.index
 			width: parent.width
 
 			property real detailsOpacity : 0
-			property int horizontalPadding: MobileComponents.Units.gridUnit / 2 - MobileComponents.Units.smallSpacing  + 1
+			property int horizontalPadding: Kirigami.Units.gridUnit / 2 - Kirigami.Units.smallSpacing  + 1
 
 			// When clicked, the mode changes to details view
 			onClicked: {
@@ -34,10 +38,10 @@ MobileComponents.Page {
 			}
 
 			Item {
-				width: parent.width - MobileComponents.Units.gridUnit
+				width: parent.width - Kirigami.Units.gridUnit
-				height: childrenRect.height - MobileComponents.Units.smallSpacing
+				height: childrenRect.height - Kirigami.Units.smallSpacing
 
-				MobileComponents.Label {
+				Kirigami.Label {
 					id: locationText
 					text: dive.location
 					font.weight: Font.Light
@@ -50,7 +54,7 @@ MobileComponents.Page {
 						right: dateLabel.left
 					}
 				}
-				MobileComponents.Label {
+				Kirigami.Label {
 					id: dateLabel
 					text: dive.date + " " + dive.time
 					opacity: 0.6
@@ -68,30 +72,30 @@ MobileComponents.Page {
 						rightMargin: horizontalPadding
 						bottom: numberText.bottom
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Depth: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: dive.depth
-						width: Math.max(MobileComponents.Units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview
+						width: Math.max(Kirigami.Units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Duration: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: dive.duration
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
 				}
-				MobileComponents.Label {
+				Kirigami.Label {
 					id: numberText
 					text: "#" + dive.number
-					color: MobileComponents.Theme.textColor
+					color: Kirigami.Theme.textColor
 					font.pointSize: subsurfaceTheme.smallPointSize
 					opacity: 0.6
 					anchors {
@@ -106,10 +110,10 @@ MobileComponents.Page {
 	Component {
 		id: tripHeading
 		Item {
-			width: page.width - MobileComponents.Units.gridUnit
+			width: page.width - Kirigami.Units.gridUnit
-			height: childrenRect.height + MobileComponents.Units.smallSpacing * 2 + Math.max(2, MobileComponents.Units.gridUnit / 2)
+			height: childrenRect.height + Kirigami.Units.smallSpacing * 2 + Math.max(2, Kirigami.Units.gridUnit / 2)
 
-			MobileComponents.Heading {
+			Kirigami.Heading {
 				id: sectionText
 				text: {
 					// if the tripMeta (which we get as "section") ends in ::-- we know
@@ -127,19 +131,19 @@ MobileComponents.Page {
 				anchors {
 					top: parent.top
 					left: parent.left
-					topMargin: Math.max(2, MobileComponents.Units.gridUnit / 2)
+					topMargin: Math.max(2, Kirigami.Units.gridUnit / 2)
-					leftMargin: MobileComponents.Units.gridUnit / 2
+					leftMargin: Kirigami.Units.gridUnit / 2
 					right: parent.right
 				}
 				level: 2
 			}
 			Rectangle {
-				height: Math.max(2, MobileComponents.Units.gridUnit / 12) // we want a thicker line
+				height: Math.max(2, Kirigami.Units.gridUnit / 12) // we want a thicker line
 				anchors {
 					top: sectionText.bottom
 					left: parent.left
-					leftMargin: MobileComponents.Units.gridUnit * -2
+					leftMargin: Kirigami.Units.gridUnit * -2
-					rightMargin: MobileComponents.Units.gridUnit * -2
+					rightMargin: Kirigami.Units.gridUnit * -2
 					right: parent.right
 				}
 				color: subsurfaceTheme.accentColor
@@ -147,6 +151,50 @@ MobileComponents.Page {
 		}
 	}
 
+        ScrollView {
+		id: startPageWrapper
+		anchors.fill: parent
+		opacity: (diveListView.count > 0 && (credentialStatus == QMLManager.VALID || credentialStatus == QMLManager.VALID_EMAIL)) ? 0 : 1
+		visible: opacity > 0
+		Behavior on opacity { NumberAnimation { duration: Kirigami.Units.shortDuration } }
+		onVisibleChanged: {
+			if (visible) {
+				page.mainAction = page.saveAction
+			} else {
+				page.mainAction = null
+			}
+		}
+
+		StartPage {
+			id: startPage
+		}
+	}
+
+	ListView {
+		id: diveListView
+		anchors.fill: parent
+		opacity: 0.8 - startPageWrapper.opacity
+		visible: opacity > 0
+		model: diveModel
+		currentIndex: -1
+		delegate: diveDelegate
+		//boundsBehavior: Flickable.StopAtBounds
+		maximumFlickVelocity: parent.height * 5
+		bottomMargin: Kirigami.Units.iconSizes.medium + Kirigami.Units.gridUnit
+		cacheBuffer: 0 // seems to avoid empty rendered profiles
+		section.property: "dive.tripMeta"
+		section.criteria: ViewSection.FullString
+		section.delegate: tripHeading
+		header: Kirigami.Heading {
+			x: Kirigami.Units.gridUnit / 2
+			height: paintedHeight + Kirigami.Units.gridUnit / 2
+			verticalAlignment: Text.AlignBottom
+			text: "Dive Log"
+		}
+		Connections {
+			target: detailsWindow
+			onCurrentIndexChanged: diveListView.currentIndex = detailsWindow.currentIndex
+		}
 		Connections {
 			target: stackView
 			onDepthChanged: {
@@ -155,37 +203,8 @@ MobileComponents.Page {
 				}
 			}
 		}
+	}
 
-	ScrollView {
-		id: outerScrollView
-		anchors.fill: parent
-		opacity: 0.8 - startPageWrapper.opacity
-		visible: opacity > 0
-		ListView {
-			id: diveListView
-			anchors.fill: parent
-			model: diveModel
-			currentIndex: -1
-			delegate: diveDelegate
-			boundsBehavior: Flickable.StopAtBounds
-			maximumFlickVelocity: parent.height * 5
-			bottomMargin: MobileComponents.Units.iconSizes.medium + MobileComponents.Units.gridUnit
-			cacheBuffer: 0 // seems to avoid empty rendered profiles
-			section.property: "dive.tripMeta"
-			section.criteria: ViewSection.FullString
-			section.delegate: tripHeading
-			header: MobileComponents.Heading {
-				x: MobileComponents.Units.gridUnit / 2
-				height: paintedHeight + MobileComponents.Units.gridUnit / 2
-				verticalAlignment: Text.AlignBottom
-				text: "Dive Log"
-			}
-			Connections {
-				target: detailsWindow
-				onCurrentIndexChanged: diveListView.currentIndex = detailsWindow.currentIndex
-			}
-		}
-	}
 
 	property QtObject saveAction: Action {
 		iconName: "document-save"
@@ -200,23 +219,4 @@ MobileComponents.Page {
 			event.accepted = true;
 		}
 	}
-
-	ScrollView {
-		id: startPageWrapper
-		anchors.fill: parent
-		opacity: (diveListView.count > 0 && (credentialStatus == QMLManager.VALID || credentialStatus == QMLManager.VALID_EMAIL)) ? 0 : 1
-		visible: opacity > 0
-		Behavior on opacity { NumberAnimation { duration: MobileComponents.Units.shortDuration } }
-		onVisibleChanged: {
-			if (visible) {
-				page.mainAction = page.saveAction
-			} else {
-				page.mainAction = null
-			}
-		}
-
-		StartPage {
-			id: startPage
-		}
-	}
 }

qt-mobile/qml/DownloadFromDiveComputer.qml

@@ -5,14 +5,15 @@ import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.Page {
+Kirigami.Page {
 	id: diveComputerDownloadWindow
 	anchors.top:parent.top
 	width: parent.width
 	height: parent.height
 	Layout.fillWidth: true;
+	title: "Dive Computer"
 
 /* this can be done by hitting the back key
 	contextualActions: [

qt-mobile/qml/GpsList.qml

@@ -6,13 +6,14 @@ import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.Page {
+Kirigami.ScrollablePage {
 	id: gpsListWindow
-	width: parent.width - MobileComponents.Units.gridUnit
+	width: parent.width - Kirigami.Units.gridUnit
-	anchors.margins: MobileComponents.Units.gridUnit / 2
+	anchors.margins: Kirigami.Units.gridUnit / 2
 	objectName: "gpsList"
+	title: "GPS Fixes"
 
 /* this can be done by hitting the back key
 	contextualActions: [
@@ -28,15 +29,16 @@ MobileComponents.Page {
  */
 	Component {
 		id: gpsDelegate
-		MobileComponents.ListItemWithActions {
+		Kirigami.ActionsForListItem {
 			id: gpsFix
 			enabled: true
 			width: parent.width
-			property int horizontalPadding: MobileComponents.Units.gridUnit / 2 - MobileComponents.Units.smallSpacing  + 1
+			property int horizontalPadding: Kirigami.Units.gridUnit / 2 - Kirigami.Units.smallSpacing  + 1
 
-			Item {
+			Kirigami.BasicListItem {
-				width: parent.width - MobileComponents.Units.gridUnit
+                                supportsMouseEvents: true
-				height: childrenRect.height - MobileComponents.Units.smallSpacing
+				width: parent.width - Kirigami.Units.gridUnit
+				height: childrenRect.height - Kirigami.Units.smallSpacing
 				GridLayout {
 					columns: 4
 					id: timeAndName
@@ -46,55 +48,55 @@ MobileComponents.Page {
 						right: parent.right
 						rightMargin: horizontalPadding
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Date: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: date
 						Layout.preferredWidth: Math.max(parent.width / 5, paintedWidth)
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Name: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: name
 						Layout.preferredWidth: Math.max(parent.width / 5, paintedWidth)
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Latitude: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: latitude
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: 'Longitude: '
 						opacity: 0.6
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
-					MobileComponents.Label {
+					Kirigami.Label {
 						text: longitude
 						font.pointSize: subsurfaceTheme.smallPointSize
 					}
 				}
 			}
 			actions: [
-				Action {
+				Kirigami.Action {
 					iconName: "trash-empty"
 					onTriggered: {
 						print("delete this!")
 						manager.deleteGpsFix(when)
 					}
 				},
-				Action {
+				Kirigami.Action {
 					iconName: "gps"
 					onTriggered: {
 						print("show map")
@@ -106,8 +108,6 @@ MobileComponents.Page {
 		}
 	}
 
-	ScrollView {
-		anchors.fill: parent
 	ListView {
 		id: gpsListView
 		anchors.fill: parent
@@ -119,12 +119,11 @@ MobileComponents.Page {
 		cacheBuffer: Math.max(5000, parent.height * 5)
 		focus: true
 		clip: true
-			header: MobileComponents.Heading {
+		header: Kirigami.Heading {
-				x: MobileComponents.Units.gridUnit / 2
+			x: Kirigami.Units.gridUnit / 2
-				height: paintedHeight + MobileComponents.Units.gridUnit / 2
+			height: paintedHeight + Kirigami.Units.gridUnit / 2
 			verticalAlignment: Text.AlignBottom
 			text: "List of stored GPS fixes"
 		}
 	}
-	}
 }

qt-mobile/qml/Log.qml

@@ -6,13 +6,14 @@ import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.Page {
+Kirigami.ScrollablePage {
 	id: logWindow
-	width: parent.width - MobileComponents.Units.gridUnit
+	width: parent.width - Kirigami.Units.gridUnit
-	anchors.margins: MobileComponents.Units.gridUnit / 2
+	anchors.margins: Kirigami.Units.gridUnit / 2
 	objectName: "Log"
+	title: "Application Log"
 
 /* this can be done by hitting the back key
 	contextualActions: [
@@ -26,8 +27,7 @@ MobileComponents.Page {
 		}
 	]
  */
-	ScrollView {
+
-		anchors.fill: parent
 	Flickable {
 		id: logFlick
 		anchors.fill: parent
@@ -35,11 +35,11 @@ MobileComponents.Page {
 		clip: true
 		ColumnLayout {
 			width: logFlick.width
-				spacing: MobileComponents.Units.smallSpacing
+			spacing: Kirigami.Units.smallSpacing
-				MobileComponents.Heading {
+			Kirigami.Heading {
 				text: "Application Log"
 			}
-				MobileComponents.Label {
+			Kirigami.Label {
 				id: logContent
 				Layout.preferredWidth: parent.width
 				Layout.maximumWidth: parent.width
@@ -48,5 +48,4 @@ MobileComponents.Page {
 			}
 		}
 	}
-	}
 }

qt-mobile/qml/Preferences.qml

@@ -3,11 +3,12 @@ import QtQuick.Controls 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
-MobileComponents.Page {
+Kirigami.Page {
 
+	title: "Preferences"
 	mainAction: Action {
 		text: "Save"
 		iconName: "document-save"
@@ -24,27 +25,27 @@ MobileComponents.Page {
 		signal accept
 
 		columns: 2
-		width: parent.width - MobileComponents.Units.gridUnit
+		width: parent.width - Kirigami.Units.gridUnit
 		anchors {
 			fill: parent
-			margins: MobileComponents.Units.gridUnit / 2
+			margins: Kirigami.Units.gridUnit / 2
 		}
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Preferences"
-			Layout.bottomMargin: MobileComponents.Units.largeSpacing / 2
+			Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
 			Layout.columnSpan: 2
 		}
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Subsurface GPS data webservice"
 			level: 3
-			Layout.topMargin: MobileComponents.Units.largeSpacing
+			Layout.topMargin: Kirigami.Units.largeSpacing
-			Layout.bottomMargin: MobileComponents.Units.largeSpacing / 2
+			Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
 			Layout.columnSpan: 2
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Distance threshold (meters)"
 			Layout.alignment: Qt.AlignRight
 		}
@@ -55,7 +56,7 @@ MobileComponents.Page {
 			Layout.fillWidth: true
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Time threshold (minutes)"
 			Layout.alignment: Qt.AlignRight
 		}

qt-mobile/qml/StartPage.qml

@@ -2,7 +2,7 @@ import QtQuick 2.5
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import QtQuick.Layouts 1.1
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
 ColumnLayout {
@@ -13,30 +13,30 @@ ColumnLayout {
 
 	function saveCredentials() { cloudCredentials.saveCredentials() }
 
-	MobileComponents.Heading {
+	Kirigami.Heading {
-		Layout.margins: MobileComponents.Units.gridUnit
+		Layout.margins: Kirigami.Units.gridUnit
 		text: "Subsurface-mobile"
 	}
-	MobileComponents.Label {
+	Kirigami.Label {
 		id: explanationText
 		Layout.fillWidth: true
-		Layout.margins: MobileComponents.Units.gridUnit
+		Layout.margins: Kirigami.Units.gridUnit
 		text: "In order to use Subsurface-mobile you need to have a Subsurface cloud storage account " +
 		      "(which can be created with the Subsurface desktop application)."
 		wrapMode: Text.WordWrap
 	}
-	MobileComponents.Label {
+	Kirigami.Label {
 		id: messageArea
 		Layout.fillWidth: true
-		Layout.margins: MobileComponents.Units.gridUnit
+		Layout.margins: Kirigami.Units.gridUnit
 		text: manager.startPageText
 		wrapMode: Text.WordWrap
 	}
 	CloudCredentials {
 		id: cloudCredentials
 		Layout.fillWidth: true
-		Layout.margins: MobileComponents.Units.gridUnit
+		Layout.margins: Kirigami.Units.gridUnit
-		Layout.topMargin: MobileComponents.Units.gridUnit * 2
+		Layout.topMargin: Kirigami.Units.gridUnit * 2
 		property int headingLevel: 3
 	}
 }

qt-mobile/qml/SubsurfaceButton.qml

@@ -1,15 +1,15 @@
 import QtQuick 2.5
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
 Button {
 	style: ButtonStyle {
 		padding {
-			top: MobileComponents.Units.smallSpacing * 2
+			top: Kirigami.Units.smallSpacing * 2
-			left: MobileComponents.Units.smallSpacing * 4
+			left: Kirigami.Units.smallSpacing * 4
-			right: MobileComponents.Units.smallSpacing * 4
+			right: Kirigami.Units.smallSpacing * 4
-			bottom: MobileComponents.Units.smallSpacing * 2
+			bottom: Kirigami.Units.smallSpacing * 2
 		}
 		background: Rectangle {
 			border.width: 1

qt-mobile/qml/ThemeTest.qml

@@ -1,10 +1,11 @@
 import QtQuick 2.5
 import QtQuick.Controls 1.4
 import QtQuick.Layouts 1.1
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.Page {
+Kirigami.Page {
 
+	title: "Theme Information"
 /* this can be done by hitting the back key
 	contextualActions: [
 		Action {
@@ -20,14 +21,14 @@ MobileComponents.Page {
 	GridLayout {
 		id: themetest
 		columns: 2
-		anchors.margins: MobileComponents.Units.gridUnit / 2
+		anchors.margins: Kirigami.Units.gridUnit / 2
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			Layout.columnSpan: 2
 			text: "Theme Information"
 		}
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Screen"
 			Layout.columnSpan: 2
 			level: 3
@@ -36,76 +37,76 @@ MobileComponents.Page {
 			id: fm
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Geometry (pixels):"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: rootItem.width + "x" + rootItem.height
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Geometry (gridUnits):"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
-			text: Math.round(rootItem.width / MobileComponents.Units.gridUnit) + "x" + Math.round(rootItem.height / MobileComponents.Units.gridUnit)
+			text: Math.round(rootItem.width / Kirigami.Units.gridUnit) + "x" + Math.round(rootItem.height / Kirigami.Units.gridUnit)
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Units.gridUnit:"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
-			text: MobileComponents.Units.gridUnit
+			text: Kirigami.Units.gridUnit
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Units.devicePixelRatio:"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
-			text: MobileComponents.Units.devicePixelRatio
+			text: Kirigami.Units.devicePixelRatio
 		}
 
-		MobileComponents.Heading {
+		Kirigami.Heading {
 			text: "Font Metrics"
 			level: 3
 			Layout.columnSpan: 2
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "FontMetrics pointSize:"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: fm.font.pointSize
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "FontMetrics pixelSize:"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: fm.height
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "FontMetrics devicePixelRatio:"
 		}
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: fm.height / fm.font.pointSize
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Text item pixelSize:"
 		}
 		Text {
 			text: font.pixelSize
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			text: "Text item pointSize:"
 		}
 		Text {
 			text: font.pointSize
 		}
 
-		MobileComponents.Label {
+		Kirigami.Label {
 			Layout.columnSpan: 2
 			Layout.fillHeight: true
 		}

qt-mobile/qml/TopBar.qml

@@ -5,21 +5,21 @@ import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
 
 Rectangle {
 	id: topPart
 
 	color: subsurfaceTheme.accentColor
-	Layout.minimumHeight: Math.round(MobileComponents.Units.gridUnit * 1.5)
+	Layout.minimumHeight: Math.round(Kirigami.Units.gridUnit * 1.5)
 	Layout.fillWidth: true
 	Layout.margins: 0
 	RowLayout {
 		anchors.verticalCenter: topPart.verticalCenter
 		Item {
 			Layout.preferredHeight: subsurfaceLogo.height
-			Layout.leftMargin: MobileComponents.Units.gridUnit / 4
+			Layout.leftMargin: Kirigami.Units.gridUnit / 4
 			Image {
 				id: subsurfaceLogo
 				source: "qrc:/qml/subsurface-mobile-icon.png"
@@ -27,16 +27,16 @@ Rectangle {
 					verticalCenter: parent.Center
 					left: parent.left
 				}
-				width: Math.round(MobileComponents.Units.gridUnit)
+				width: Math.round(Kirigami.Units.gridUnit)
 				height: width
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
 				text: qsTr("Subsurface-mobile")
-				font.pointSize: Math.round(MobileComponents.Theme.defaultFont.pointSize)
+				font.pointSize: Math.round(Kirigami.Theme.defaultFont.pointSize)
 				height: subsurfaceLogo.height
 				anchors {
 					left: subsurfaceLogo.right
-					leftMargin: Math.round(MobileComponents.Units.gridUnit / 2)
+					leftMargin: Math.round(Kirigami.Units.gridUnit / 2)
 				}
 				font.weight: Font.Light
 				verticalAlignment: Text.AlignVCenter

qt-mobile/qml/main.qml

@@ -6,9 +6,9 @@ import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
 import org.subsurfacedivelog.mobile 1.0
-import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
+import org.kde.kirigami 1.0 as Kirigami
 
-MobileComponents.ApplicationWindow {
+Kirigami.ApplicationWindow {
 	id: rootItem
 	title: qsTr("Subsurface-mobile")
 	property bool fullscreen: true
@@ -37,20 +37,20 @@ MobileComponents.ApplicationWindow {
 		detailsWindow.endEditMode()
 	}
 
-	globalDrawer: MobileComponents.GlobalDrawer {
+	globalDrawer: Kirigami.GlobalDrawer {
 		title: "Subsurface"
 		titleIcon: "qrc:/qml/subsurface-mobile-icon.png"
 
 		bannerImageSource: "dive.jpg"
 		actions: [
-			Action {
+			Kirigami.Action {
 				text: "Dive list"
 				onTriggered: {
 					returnTopPage()
 					globalDrawer.close()
 				}
 			},
-			Action {
+			Kirigami.Action {
 				text: "Cloud credentials"
 				onTriggered: {
 					returnTopPage()
@@ -64,7 +64,7 @@ MobileComponents.ApplicationWindow {
 					manager.credentialStatus = QMLManager.UNKNOWN
 				}
 			},
-			MobileComponents.ActionGroup {
+			Kirigami.Action {
 				text: "Manage dives"
 				enabled: manager.credentialStatus === QMLManager.VALID || manager.credentialStatus === QMLManager.VALID_EMAIL
 			/*
@@ -77,7 +77,7 @@ MobileComponents.ApplicationWindow {
 					}
 				}
 			 */
-				Action {
+				Kirigami.Action {
 					text: "Add dive manually"
 					onTriggered: {
 						detailsWindow.state = "add"
@@ -100,7 +100,7 @@ MobileComponents.ApplicationWindow {
 						stackView.push(detailsWindow)
 					}
 				}
-				Action {
+				Kirigami.Action {
 					text: "Refresh"
 					onTriggered: {
 						detailsWindow.endEditMode()
@@ -116,31 +116,31 @@ MobileComponents.ApplicationWindow {
 				}
 			},
 
-			MobileComponents.ActionGroup {
+			Kirigami.Action {
 				text: "GPS"
 				enabled: manager.credentialStatus === QMLManager.VALID || manager.credentialStatus === QMLManager.VALID_EMAIL
-				Action {
+				Kirigami.Action {
 					text: "GPS-tag dives"
 					onTriggered: {
 						manager.applyGpsData();
 					}
 				}
 
-				Action {
+				Kirigami.Action {
 					text: "Upload GPS data"
 					onTriggered: {
 						manager.sendGpsData();
 					}
 				}
 
-				Action {
+				Kirigami.Action {
 					text: "Download GPS data"
 					onTriggered: {
 						manager.downloadGpsData();
 					}
 				}
 
-				Action {
+				Kirigami.Action {
 					text: "Show GPS fixes"
 					onTriggered: {
 						manager.populateGpsData();
@@ -148,13 +148,13 @@ MobileComponents.ApplicationWindow {
 					}
 				}
 
-				Action {
+				Kirigami.Action {
 					text: "Clear GPS cache"
 					onTriggered: {
 						manager.clearGpsData();
 					}
 				}
-				Action {
+				Kirigami.Action {
 					text: "Preferences"
 					onTriggered: {
 						stackView.push(prefsWindow)
@@ -163,22 +163,22 @@ MobileComponents.ApplicationWindow {
 				}
 			},
 
-			MobileComponents.ActionGroup {
+			Kirigami.Action {
 				text: "Developer"
-				Action {
+				Kirigami.Action {
 					text: "App log"
 					onTriggered: {
 						stackView.push(logWindow)
 					}
 				}
 
-				Action {
+				Kirigami.Action {
 					text: "Theme information"
 					onTriggered: {
 						stackView.push(themetest)
 					}
 				}
-				Action {
+				Kirigami.Action {
 					checkable: true
 					checked: manager.verboseEnabled
 					text: checked ? "Disable verbose (for adb logcat)" : "Enable verbose (for adb logcat)"
@@ -187,7 +187,7 @@ MobileComponents.ApplicationWindow {
 					}
 				}
 			},
-			Action {
+			Kirigami.Action {
 				text: "About"
 				onTriggered: {
 					stackView.push(aboutWindow)
@@ -198,7 +198,7 @@ MobileComponents.ApplicationWindow {
 
 		MouseArea {
 			height: childrenRect.height
-			width: MobileComponents.Units.gridUnit * 10
+			width: Kirigami.Units.gridUnit * 10
 			CheckBox {
 				//text: "Run location service"
 				id: locationCheckbox
@@ -211,8 +211,8 @@ MobileComponents.ApplicationWindow {
 					manager.locationServiceEnabled = checked;
 				}
 			}
-			MobileComponents.Label {
+			Kirigami.Label {
-				x: MobileComponents.Units.gridUnit * 1.5
+				x: Kirigami.Units.gridUnit * 1.5
 				anchors {
 					left: locationCheckbox.right
 					//leftMargin: units.smallSpacing
@@ -227,7 +227,7 @@ MobileComponents.ApplicationWindow {
 		}
 	}
 
-	contextDrawer: MobileComponents.ContextDrawer {
+	contextDrawer: Kirigami.ContextDrawer {
 		id: contextDrawer
 		actions: rootItem.pageStack.currentPage ? rootItem.pageStack.currentPage.contextualActions : null
 		title: "Actions"
@@ -240,16 +240,11 @@ MobileComponents.ApplicationWindow {
 		property color accentColor: "#2d5b9a"
 		property color shadedColor: "#132744"
 		property color accentTextColor: "#ececec"
-		property int columnWidth: Math.round(rootItem.width/(MobileComponents.Units.gridUnit*30)) > 0 ? Math.round(rootItem.width / Math.round(rootItem.width/(MobileComponents.Units.gridUnit*30))) : rootItem.width
+		property int columnWidth: Math.round(rootItem.width/(Kirigami.Units.gridUnit*30)) > 0 ? Math.round(rootItem.width / Math.round(rootItem.width/(Kirigami.Units.gridUnit*30))) : rootItem.width
-	}
-
-	toolBar: TopBar {
-		width: parent.width
-		height: Layout.minimumHeight
 	}
 
 	property Item stackView: pageStack
-	initialPage: DiveList {
+	pageStack.initialPage: DiveList {
 		anchors.fill: detailsPage
 		id: diveList
 		opacity: 0
@@ -295,6 +290,7 @@ MobileComponents.ApplicationWindow {
 
 	GpsList {
 		id: gpsWindow
+		visible: false
 	}
 
 	ThemeTest {
@@ -303,6 +299,7 @@ MobileComponents.ApplicationWindow {
 	}
 
 	Component.onCompleted: {
+		Kirigami.Theme.highlightColor = subsurfaceTheme.accentColor
 		manager.finishSetup();
 		rootItem.visible = true
 		diveList.opacity = 1