From 05197a3f386a8ba26be689805402186efdb4e000 Mon Sep 17 00:00:00 2001 From: Michael Bohlender Date: Thu, 20 Apr 2017 14:04:49 +0200 Subject: introduce main sidebar --- components/kube/contents/ui/Kube.qml | 343 +++++++++++++++++++---------------- 1 file changed, 189 insertions(+), 154 deletions(-) (limited to 'components') diff --git a/components/kube/contents/ui/Kube.qml b/components/kube/contents/ui/Kube.qml index 73238a25..f96fef17 100644 --- a/components/kube/contents/ui/Kube.qml +++ b/components/kube/contents/ui/Kube.qml @@ -121,97 +121,151 @@ Controls2.ApplicationWindow { //END background //BEGIN Main content - SplitView { - anchors { - top: app.top - left: app.left - } - height: app.height - width: app.width + RowLayout { + + anchors.fill: parent - Rectangle { - width: Kube.Units.gridUnit * 10 - Layout.maximumWidth: app.width * 0.25 - Layout.minimumWidth: Kube.Units.gridUnit * 5 + spacing: 0 - color: Kube.Colors.textColor + Rectangle { + id: sideBar - Kube.PositiveButton { - id: newMailButton + width: Kube.Units.gridUnit + Kube.Units.largeSpacing + height: app.height + color: "#232629"//Kube.Colors.textColor + Column { anchors { top: parent.top - left: parent.left - right: parent.right - margins: Kube.Units.largeSpacing + topMargin: Kube.Units.largeSpacing + horizontalCenter: parent.horizontalCenter } - text: qsTr("New Email") + spacing: Kube.Units.largeSpacing - Kube.Units.smallSpacing - onClicked: { - composer.open() + ToolButton { + iconName: Kube.Icons.search_inverted + height: Kube.Units.gridUnit * 1.5 + width: height + + onClicked: { + search.open() + } } - } - Item { - id: accountName + ToolButton { + height: Kube.Units.gridUnit * 1.5 + width: height - Kube.FolderController { - id: accountNameFolderController - accountId: accountSwitcher.accountId + iconName: Kube.Icons.mail_inverted + + onClicked: { + //TODO + } } - Menu { - id: contextMenu - title: "Edit" + ToolButton { + height: Kube.Units.gridUnit * 1.5 + width: height - MenuItem { - text: "Synchronize" - onTriggered: { - accountNameFolderController.synchronizeAction.execute() - } + iconName: Kube.Icons.user_inverted + + onClicked: { + people.open() } } + } + } - anchors { - top: newMailButton.bottom - topMargin: Kube.Units.smallSpacing - } + SplitView { + + height: app.height + + Layout.fillWidth: true - width: parent.width - height: Kube.Units.gridUnit * 2 + Rectangle { + width: Kube.Units.gridUnit * 10 + Layout.maximumWidth: app.width * 0.25 + Layout.minimumWidth: Kube.Units.gridUnit * 5 + + color: Kube.Colors.textColor + + Kube.PositiveButton { + id: newMailButton + + anchors { + top: parent.top + left: parent.left + right: parent.right + margins: Kube.Units.largeSpacing + } + + text: qsTr("New Email") - MouseArea { - anchors.fill: parent - acceptedButtons: Qt.RightButton onClicked: { - contextMenu.popup() + composer.open() } } - Repeater { - model: currentAccountModel - Row { - spacing: Kube.Units.smallSpacing - anchors { - bottom: parent.bottom - left: parent.left - leftMargin: Kube.Units.smallSpacing + Item { + id: accountName + + Kube.FolderController { + id: accountNameFolderController + accountId: accountSwitcher.accountId + } + + Menu { + id: contextMenu + title: "Edit" + + MenuItem { + text: "Synchronize" + onTriggered: { + accountNameFolderController.synchronizeAction.execute() + } } - Layout.fillHeight: true + } - Kube.Label{ - text: model.name - font.weight: Font.Bold - color: Kube.Colors.highlightedTextColor + anchors { + top: newMailButton.bottom + topMargin: Kube.Units.smallSpacing + } + + width: parent.width + height: Kube.Units.gridUnit * 2 + + MouseArea { + anchors.fill: parent + acceptedButtons: Qt.RightButton + onClicked: { + contextMenu.popup() } + } - Kube.Icon { - id: statusIcon - visible: false - iconName: "" - states: [ + Repeater { + model: currentAccountModel + Row { + spacing: Kube.Units.smallSpacing + anchors { + bottom: parent.bottom + left: parent.left + leftMargin: Kube.Units.smallSpacing + } + Layout.fillHeight: true + + Kube.Label{ + text: model.name + font.weight: Font.Bold + color: Kube.Colors.highlightedTextColor + } + + Kube.Icon { + id: statusIcon + visible: false + iconName: "" + states: [ State { name: "busy"; when: model.status == Kube.AccountsModel.BusyStatus PropertyChanges { target: statusIcon; iconName: Kube.Icons.busy_inverted; visible: true } @@ -228,129 +282,110 @@ Controls2.ApplicationWindow { name: "disconnected"; when: model.status == Kube.AccountsModel.OfflineStatus PropertyChanges { target: statusIcon; iconName: Kube.Icons.noNetworkConnection_inverted; visible: true } } - ] + ] + } } } } - } - Kube.FolderListView { - id: folderListView + Kube.FolderListView { + id: folderListView - anchors { - top: accountName.bottom - topMargin: Kube.Units.smallSpacing - bottom: statusBar.top - left: parent.left - right: parent.right - } - - focus: true - accountId: accountSwitcher.accountId - } + anchors { + top: accountName.bottom + topMargin: Kube.Units.smallSpacing + bottom: statusBar.top + left: parent.left + right: parent.right + } - Item { - id: statusBar - anchors { - topMargin: Kube.Units.smallSpacing - bottom: outbox.top - left: parent.left - right: parent.right + focus: true + accountId: accountSwitcher.accountId } - height: Kube.Units.gridUnit + Item { + id: statusBar + anchors { + topMargin: Kube.Units.smallSpacing + bottom: outbox.top + left: parent.left + right: parent.right + } - Repeater { - model: currentAccountModel - Kube.Label { - id: statusText - anchors.centerIn: parent - visible: false - color: Kube.Colors.highlightedTextColor - states: [ + height: Kube.Units.gridUnit + + Repeater { + model: currentAccountModel + Kube.Label { + id: statusText + anchors.centerIn: parent + visible: false + color: Kube.Colors.highlightedTextColor + states: [ State { name: "disconnected"; when: model.status == Kube.AccountsModel.OfflineStatus PropertyChanges { target: statusText; text: "Offline"; visible: true } } - ] + ] + } } } - } - - Kube.Outbox { - id: outbox - - anchors { - bottom: toolBar.top - left: parent.left - right: parent.right - } - height: Kube.Units.gridUnit * 1.5 - } - - Item { - id: toolBar + Kube.Outbox { + id: outbox - anchors { - bottom: parent.bottom - left: parent.left - right: parent.right + anchors { + bottom: toolBar.top + left: parent.left + right: parent.right + } + height: Kube.Units.gridUnit * 1.5 } - height: Kube.Units.gridUnit * 2 - RowLayout { - anchors.centerIn: parent - spacing: Kube.Units.largeSpacing + Item { + id: toolBar - Kube.AccountSwitcher { - id: accountSwitcher - iconName: Kube.Icons.menu_inverted - height: Kube.Units.gridUnit * 1.5 - width: height + anchors { + bottom: parent.bottom + left: parent.left + right: parent.right } + height: Kube.Units.gridUnit * 2 - ToolButton { - iconName: Kube.Icons.user_inverted - height: Kube.Units.gridUnit * 1.5 - width: height - - onClicked: { - people.open() - } - } + RowLayout { + anchors.centerIn: parent - ToolButton { - iconName: Kube.Icons.search_inverted - height: Kube.Units.gridUnit * 1.5 - width: height + spacing: Kube.Units.largeSpacing - onClicked: { - search.open() + Kube.AccountSwitcher { + id: accountSwitcher + iconName: Kube.Icons.menu_inverted + height: Kube.Units.gridUnit * 1.5 + width: height } } } - } - } + } - Kube.MailListView { - id: mailListView - parentFolder: folderListView.currentFolder - width: Kube.Units.gridUnit * 20 - height: parent.height - Layout.maximumWidth: app.width * 0.4 - Layout.minimumWidth: Kube.Units.gridUnit * 10 - focus: true - } + Kube.MailListView { + id: mailListView + parentFolder: folderListView.currentFolder + width: Kube.Units.gridUnit * 20 + height: parent.height + Layout.maximumWidth: app.width * 0.4 + Layout.minimumWidth: Kube.Units.gridUnit * 10 + focus: true + } - Kube.ConversationView { - id: mailView - mail: mailListView.currentMail - Layout.fillWidth: true - hideTrash: !folderListView.isTrashFolder - hideNonTrash: folderListView.isTrashFolder + Kube.ConversationView { + id: mailView + mail: mailListView.currentMail + Layout.fillWidth: true + hideTrash: !folderListView.isTrashFolder + hideNonTrash: folderListView.isTrashFolder + } } } //END Main content -- cgit v1.2.3