From ae4fd535f8bd564414dbe31c100575463b0c2c32 Mon Sep 17 00:00:00 2001 From: yann300 Date: Mon, 9 Feb 2015 15:35:20 +0100 Subject: [PATCH] Project Files - ux improvement. --- mix/qml/FilesSection.qml | 21 ++++++++++++++------- mix/qml/ProjectList.qml | 15 +++++++++++++-- mix/qml/Style.qml | 9 +++++---- mix/qml/js/ProjectModel.js | 2 +- 4 files changed, 33 insertions(+), 14 deletions(-) diff --git a/mix/qml/FilesSection.qml b/mix/qml/FilesSection.qml index d532fb2b1..f0a6e3745 100644 --- a/mix/qml/FilesSection.qml +++ b/mix/qml/FilesSection.qml @@ -54,6 +54,12 @@ ColumnLayout { source: "qrc:/qml/fonts/SourceSansPro-Regular.ttf" } + FontLoader + { + id: semiBoldFont + source: "qrc:/qml/fonts/SourceSansPro-Bold.ttf" + } + RowLayout { anchors.top: parent.top @@ -64,12 +70,12 @@ ColumnLayout { Image { source: "qrc:/qml/img/opentriangleindicator_filesproject.png" width: 15 - sourceSize.width: 15 + sourceSize.width: 12 id: imgArrow anchors.right: section.left - anchors.rightMargin: 5 + anchors.rightMargin: 8 anchors.top: parent.top - anchors.topMargin: 8 + anchors.topMargin: 6 } Text @@ -79,10 +85,8 @@ ColumnLayout { anchors.left: parent.left anchors.leftMargin: Style.general.leftMargin color: Style.documentsList.sectionColor - font.family: fileNameFont.name - font.pointSize: Style.documentsList.fontSize - font.weight: Font.Bold - font.letterSpacing: 1 + font.family: semiBoldFont.name + font.pointSize: Style.documentsList.sectionFontSize states: [ State { name: "hidden" @@ -154,6 +158,9 @@ ColumnLayout { rootItem.isSelected = true; else rootItem.isSelected = false; + + if (rootItem.isSelected && section.state === "hidden") + section.state = ""; } } } diff --git a/mix/qml/ProjectList.qml b/mix/qml/ProjectList.qml index cf114390b..138e86fe9 100644 --- a/mix/qml/ProjectList.qml +++ b/mix/qml/ProjectList.qml @@ -15,7 +15,7 @@ Item { FontLoader { id: srcSansProLight - source: "qrc:/qml/fonts/SourceSansPro-Regular.ttf" + source: "qrc:/qml/fonts/SourceSansPro-Light.ttf" } Rectangle @@ -54,6 +54,7 @@ Item { font.family: srcSansProLight.name font.pointSize: Style.title.pointSize anchors.verticalCenter: parent.verticalCenter + font.weight: Font.Light } } @@ -79,7 +80,7 @@ Item { spacing: 0 Repeater { - model: ["Contracts", "Javascript", "HTML", "Styles", "Images", "Misc"] + model: [qsTr("Contracts"), qsTr("Javascript"), qsTr("Web Pages"), qsTr("Styles"), qsTr("Images"), qsTr("Misc")]; signal selected(string doc, string groupName) id: sectionRepeater FilesSection @@ -127,6 +128,11 @@ Item { } } + onDocumentOpened: { + if (document.groupName === modelData) + sectionRepeater.selected(document.documentId, modelData); + } + onNewProject: { sectionModel.clear(); } @@ -145,7 +151,12 @@ Item { { var newDoc = projectModel.getDocument(documentId); if (newDoc.groupName === modelData) + { sectionModel.append(newDoc); + projectModel.openDocument(newDoc.documentId); + sectionRepeater.selected(newDoc.documentId, modelData); + } + } } } diff --git a/mix/qml/Style.qml b/mix/qml/Style.qml index 91745749f..348d8c4d1 100644 --- a/mix/qml/Style.qml +++ b/mix/qml/Style.qml @@ -12,7 +12,7 @@ QtObject { property QtObject title: QtObject { property string color: "#808080" property string background: "#f0f0f0" - property int height: 70 + property int height: 55 property int pointSize: 18 } @@ -22,8 +22,9 @@ QtObject { property string sectionColor: "#808080" property string selectedColor: "white" property string highlightColor: "#4a90e2" - property int height: 32 - property int fileNameHeight: 45 - property int fontSize: 15 + property int height: 25 + property int fileNameHeight: 30 + property int fontSize: 13 + property int sectionFontSize: 13 } } diff --git a/mix/qml/js/ProjectModel.js b/mix/qml/js/ProjectModel.js index 19a56432e..ac44dffa9 100644 --- a/mix/qml/js/ProjectModel.js +++ b/mix/qml/js/ProjectModel.js @@ -90,7 +90,7 @@ function addFile(fileName) { var isJs = extension === ".js"; var isImg = extension === ".png" || extension === ".gif" || extension === ".jpg" || extension === ".svg"; var syntaxMode = isContract ? "solidity" : isJs ? "javascript" : isHtml ? "htmlmixed" : isCss ? "css" : ""; - var groupName = isContract ? "Contracts" : isJs ? "Javascript" : isHtml ? "HTML" : isCss ? "Styles" : isImg ? "Images" : "Misc"; + var groupName = isContract ? qsTr("Contracts") : isJs ? qsTr("Javascript") : isHtml ? qsTr("Web Pages") : isCss ? qsTr("Styles") : isImg ? qsTr("Images") : qsTr("Misc"); var docData = { contract: false, path: p,