Home tab bar as designed

9 files changed, 74 insertions, 22 deletions

diff --git a/Home.qml b/Home.qml
index c836ecf..c337062 100644
--- a/Home.qml
+++ b/Home.qml
@@ -35,7 +35,6 @@ HomeForm {
 	}
 
 	footer: MainTabBarForm {
-		id: tabBar
 		width: parent.width
 		leftTabButton.onClicked: layout.currentIndex = 0
 		middleTabButton.onClicked: layout.currentIndex = 1
diff --git a/MainTabBarForm.ui.qml b/MainTabBarForm.ui.qml
index 1e216ac..6a53398 100644
--- a/MainTabBarForm.ui.qml
+++ b/MainTabBarForm.ui.qml
@@ -1,38 +1,84 @@
 import QtQuick 2.15
 import QtQuick.Controls 2.15
 
-TabBar {
+Rectangle {
 	property alias leftTabButton: leftTabButton
 	property alias middleTabButton: middleTabButton
 	property alias rightTabButton: rightTabButton
 
-	id: tabBar
+	color: "#fcfcfc"
 	width: 360
+	height: 80
 
-	TabButton {
-		id: leftTabButton
+	FontLoader {
+		id: robotoMono
+		source: "fonts/RobotoMono-Regular.ttf"
+	}
+
+	TabBar {
+		anchors.fill: parent
+
+		TabButton {
+			id: leftTabButton
+			height: parent.height
+			anchors.verticalCenter: parent.verticalCenter
+
+			Image {
+				source: "circle.png"
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.top: parent.top
+				anchors.topMargin: 22
+			}
 
-		Image {
-			anchors.centerIn: parent
+			Text {
+				text: qsTr("Today")
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.bottom: parent.bottom
+				anchors.bottomMargin: 16
+				font.family: robotoMono.name
+			}
 		}
-	}
 
-	TabButton {
-		id: middleTabButton
-		x: tabBar.width / 3
+		TabButton {
+			id: middleTabButton
+			height: parent.height
+			anchors.verticalCenter: parent.verticalCenter
+
+			Image {
+				source: "triangle.png"
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.top: parent.top
+				anchors.topMargin: 22
+			}
 
-		Image {
-			anchors.centerIn: parent
-			source: "active-indicator.png"
+			Text {
+				text: qsTr("Projects")
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.bottom: parent.bottom
+				anchors.bottomMargin: 16
+				font.family: robotoMono.name
+			}
 		}
-	}
 
-	TabButton {
-		id: rightTabButton
-		x: tabBar.width * 2 / 3
+		TabButton {
+			id: rightTabButton
+			height: parent.height
+			anchors.verticalCenter: parent.verticalCenter
+
+			Image {
+				source: "square.png"
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.top: parent.top
+				anchors.topMargin: 22
+			}
 
-		Image {
-			anchors.centerIn: parent
+			Text {
+				text: qsTr("Label")
+				anchors.horizontalCenter: parent.horizontalCenter
+				anchors.bottom: parent.bottom
+				anchors.bottomMargin: 16
+				font.family: robotoMono.name
+			}
 		}
 	}
 }
diff --git a/circle.png b/circle.png
new file mode 100644
index 0000000..3e967e3
--- /dev/null
+++ b/circle.png
diff --git a/fonts/RobotoMono-Regular.ttf b/fonts/RobotoMono-Regular.ttf
new file mode 100644
index 0000000..7c4ce36
--- /dev/null
+++ b/fonts/RobotoMono-Regular.ttf
diff --git a/kelakon.qrc b/kelakon.qrc
index b85aef9..8944105 100644
--- a/kelakon.qrc
+++ b/kelakon.qrc
@@ -14,7 +14,11 @@
 		<file>qtquickcontrols2.conf</file>
 		<file>kelakon-logo.png</file>
 		<file>onboarding-1.png</file>
-		<file>active-indicator.png</file>
 		<file>MainTabBarForm.ui.qml</file>
+		<file>circle.png</file>
+		<file>triangle.png</file>
+		<file>square.png</file>
+		<file>active-indicator.png</file>
+		<file>fonts/RobotoMono-Regular.ttf</file>
 	</qresource>
 </RCC>
diff --git a/larva b/larva
-Subproject 6e4b396a3f81e798cd30a023fa471473fd1151e
+Subproject 76d0bb80bf9e0ee779a3c82408d243d8ffbe152
diff --git a/main.qml b/main.qml
index c4bb7df..d010491 100644
--- a/main.qml
+++ b/main.qml
@@ -7,7 +7,10 @@ ApplicationWindow {
 	signal ticketHistoryList(int id, bool longFormat)
 	signal ticketNew(string queue, string requestor)
 	function pushHome() {
-		pageView.push("Home.qml")
+		pageView.push("Home.qml", {
+			"width": window.width,
+			"height": window.height
+		})
 	}
 	function pushTicketHistory() {
 		pageView.push("TicketHistory.qml")
diff --git a/square.png b/square.png
new file mode 100644
index 0000000..06f20b1
--- /dev/null
+++ b/square.png
diff --git a/triangle.png b/triangle.png
new file mode 100644
index 0000000..5621415
--- /dev/null
+++ b/triangle.png