Harmattan font size changes testing

[marketstoday] / src / qml / MarketsTodayApp.qml

diff --git a/src/qml/MarketsTodayApp.qml b/src/qml/MarketsTodayApp.qml
index 8542773..f3ac3e8 100644 (file)
--- a/src/qml/MarketsTodayApp.qml
+++ b/src/qml/MarketsTodayApp.qml
@@ -43,9 +43,12 @@ PageStackWindow {
     Page {
         id: mainPage
 
-        property int itemHeight: 50
+        property int itemHeight: 75
         property int titleBarHeight: 60
         property int toolBarHeight: 40
+        property int fontSizeMed: 24
+        property int fontSizeSmall: 20
+        property int colSpacing: 4
         property int componentWidth: mainPage.width
 
         function reloadData(){
@@ -128,16 +131,16 @@ PageStackWindow {
                         }
 
                         Row {
-                            x: 30;y: 15;
+                            x: 30;y: (wrapper.height - mainPage.fontSizeMed)/2;
                             width: mainPage.componentWidth - 60;
                             spacing: 5
 
-                            Text { text: stockName; width: parent.width * 30/100; font.pixelSize: 18; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" }
-                            Text { text: lastTradedPrice; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
-                            Text { text: change !== ""? (change + " ("+changePercentage+")"):""; width: parent.width * 25/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight
+                            Text { text: stockName; width: parent.width * 30/100; font.pixelSize: mainPage.fontSizeMed; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" }
+                            Text { text: lastTradedPrice; width: parent.width * 15/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
+                            Text { text: change !== ""? (change + " ("+changePercentage+")"):""; width: parent.width * 25/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight
                                 color: change >= 0 ? "#00ff00":"#ff0000"; style: Text.Raised; styleColor: "black"}
-                            Text { text: volume; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
-                            Text { text: marketCap; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
+                            Text { text: volume; width: parent.width * 18/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
+                            Text { text: marketCap; width: parent.width * 12/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
                         }
                     }
                 }
@@ -163,24 +166,24 @@ PageStackWindow {
                         }
 
                         Row {
-                            x: 10;y: 15;
+                            x: 10;y: (wrapperItem.height - mainPage.fontSizeMed)/2;
                             width: mainPage.componentWidth - 5;
                             spacing: 3
 
-                            Text { text: stockName; width: parent.width * 42/100; font.pixelSize: 18; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" }
-                            Text { text: lastTradedPrice; width: parent.width * 20/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
+                            Text { text: stockName; width: parent.width * 42/100; font.pixelSize: mainPage.fontSizeMed; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black"}
+                            Text { text: lastTradedPrice; width: parent.width * 20/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black"}
                             Column {
-                                y: -15;
+                                y: (wrapperItem.height - mainPage.colSpacing - mainPage.fontSizeSmall*2)/2 - (wrapperItem.height - mainPage.fontSizeMed)/2;
                                 width: parent.width * 18/100; height: parent.height
-                                spacing: 2
-                                Text { text: change; font.pixelSize: 16; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight
+                                spacing: mainPage.colSpacing
+                                Text { text: change; font.pixelSize: mainPage.fontSizeSmall; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight
                                     color: change >= 0 ? "#00ff00":"#ff0000";
                                         style: Text.Raised; styleColor: "black" }
-                                Text { text: changePercentage; font.pixelSize: 16; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight;
+                                Text { text: changePercentage; font.pixelSize: mainPage.fontSizeSmall; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight;
                                     color: change >= 0 ? "#00ff00":"#ff0000";
                                         style: Text.Raised; styleColor: "black" }
                             }
-                            Text { text: volume; width: parent.width * 20/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
+                            Text { text: volume !== ''? Common.abbreviateNumber(volume,2) :''; width: parent.width * 20/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black"}
                         }
                     }
                 }
@@ -199,7 +202,7 @@ PageStackWindow {
                             anchors.left: parent.left
                             anchors.leftMargin: 10
                             anchors.right: parent.right
-                            text: title; font.pixelSize: 18
+                            text: title; font.pixelSize: mainPage.fontSizeSmall
                             font.bold: false;
                             verticalAlignment: Text.AlignVCenter
                             horizontalAlignment: Text.AlignLeft