QML-UI: basics for theming and hi-dpi support

- Theme: For theming, we're just defining some colors centrally for now
- Units: This object provides dpi-corrected sizing in the form of
  gridUnit. The idea is to base gridUnit on the rendered font size, so
  the ui scales with text size. As this interpolates font size and dpi,
  the sizing is rather responsive.

These are the basics, now we can kill lots of hardcoded pixel values.

Signed-off-by: Sebastian Kügler <sebas@kde.org>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

qt-mobile/main.qml

@@ -6,6 +6,8 @@ import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
 import org.subsurfacedivelog.mobile 1.0
+import "qrc:/qml/theme" as Theme
+
 
 ApplicationWindow {
 	title: qsTr("Subsurface mobile")
@@ -13,6 +15,14 @@ ApplicationWindow {
 	property alias messageText: message.text
 	visible: true
 
+	Theme.Units {
+		id: units
+	}
+
+	Theme.Theme {
+		id: theme
+	}
+
 	Menu {
 		id: prefsMenu
 		title: "Menu"
@@ -181,4 +191,10 @@ ApplicationWindow {
 		id: logWindow
 		visible: false
 	}
+
+	Component.onCompleted: {
+		print("main.qml laoded.");
+		print("gridUnit is: " + units.gridUnit);
+		print("hightlight : " + theme.highlightColor);
+	}
 }

qt-mobile/mobile-resources.qrc

@@ -9,4 +9,8 @@
         <file>Log.qml</file>
         <file>TopBar.qml</file>
     </qresource>
+    <qresource prefix="/qml/theme">
+        <file alias="Theme.qml">theme/Theme.qml</file>
+        <file alias="Units.qml" >theme/Units.qml</file>
+    </qresource>
 </RCC>

qt-mobile/theme/Theme.qml

@@ -0,0 +1,7 @@
+import QtQuick 2.3
+
+QtObject {
+	property color textColor: "#333333"
+	property color backgroundColor: "#ececec"
+	property color highlightColor: "#91c4e1"
+}

qt-mobile/theme/Units.qml

@@ -0,0 +1,5 @@
+import QtQuick 2.3
+
+QtObject {
+	property int gridUnit: 24
+}