diff options
-rw-r--r-- | components/icons/more-vert-24px.svg | 1 | ||||
-rw-r--r-- | components/icons/notes-24px.svg | 1 | ||||
-rw-r--r-- | features/TaskDetailForm.ui.qml | 158 | ||||
-rw-r--r-- | material-design-icons.qrc | 30 |
4 files changed, 113 insertions, 77 deletions
diff --git a/components/icons/more-vert-24px.svg b/components/icons/more-vert-24px.svg new file mode 100644 index 0000000..6d6e3a7 --- /dev/null +++ b/components/icons/more-vert-24px.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"/><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>
\ No newline at end of file diff --git a/components/icons/notes-24px.svg b/components/icons/notes-24px.svg new file mode 100644 index 0000000..34be213 --- /dev/null +++ b/components/icons/notes-24px.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"/><path d="M21 11.01L3 11v2h18zM3 16h12v2H3zM21 6H3v2.01L21 8z"/></svg>
\ No newline at end of file diff --git a/features/TaskDetailForm.ui.qml b/features/TaskDetailForm.ui.qml index 48e3a49..3125bef 100644 --- a/features/TaskDetailForm.ui.qml +++ b/features/TaskDetailForm.ui.qml @@ -12,76 +12,108 @@ Page { property alias taskTitle: taskTitle property alias taskDescription: taskDescription + property alias backButton: backButton - Row { - id: row - anchors.fill: parent - RowLayout { - id: taskTitleLayout - width: parent.width - height: 56 - TextField { - id: taskTitle - Layout.rightMargin: 16 - Layout.leftMargin: 72 - Layout.fillWidth: true - placeholderText: qsTr("Enter task title") - } + header: ToolBar { + background: Rectangle { + color: "#FAFFFFFF" } RowLayout { - id: taskDescriptionLayout - width: parent.width - height: 56 - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: taskTitleLayout.bottom - anchors.topMargin: 16 - TextField { - id: taskDescription - Layout.rightMargin: 16 - Layout.leftMargin: 72 - Layout.fillWidth: true - placeholderText: qsTr("Enter task description") + id: toolBar + anchors.fill: parent + spacing: 0 + ToolButton { + id: backButton + icon.name: "back-button" + icon.source: "/components/icons/arrow-back-24px.svg" + highlighted: true } - } - RowLayout { - id: attachmentLayout - height: 56 - anchors.top: taskDescriptionLayout.bottom - anchors.topMargin: 16 - width: parent.width - Image { - opacity: 0.54 - sourceSize.height: 24 - sourceSize.width: 24 - Layout.leftMargin: 16 - source: "/components/icons/attachment-24px.svg" + ToolButton { + id: toolMoreButton + icon.name: "more-button" + icon.source: "/components/icons/more-vert-24px.svg" + highlighted: true + Layout.alignment: Qt.AlignRight | Qt.AlignVCenter } - ItemDelegate { - id: itemDelegate - highlighted: false + } + } + RowLayout { + id: taskTitleLayout + height: 56 + anchors.top: parent.top + anchors.topMargin: 0 + anchors.right: parent.right + anchors.rightMargin: 0 + anchors.left: parent.left + anchors.leftMargin: 0 + Layout.fillWidth: true - /* - background: Rectangle { - color: Material.primary - radius: 8 - } - */ - anchors.verticalCenter: parent.verticalCenter - Layout.fillWidth: true - Layout.fillHeight: true - Label { - text: qsTr("Attachment") - anchors.left: parent.left - anchors.leftMargin: 24 - anchors.verticalCenterOffset: 0 - leftPadding: 0 - anchors.verticalCenter: parent.verticalCenter - font.weight: Font.Medium - font.pixelSize: 20 - font.family: "Work Sans" - } - } + TextField { + id: taskTitle + Layout.rightMargin: 16 + Layout.leftMargin: 66 + Layout.fillWidth: true + placeholderText: qsTr("Enter task title") + } + } + RowLayout { + id: taskDescriptionLayout + width: parent.width + height: 56 + anchors.horizontalCenter: parent.horizontalCenter + anchors.top: taskTitleLayout.bottom + anchors.topMargin: 24 + Image { + id: descriptionIcon + sourceSize.height: 24 + sourceSize.width: 24 + Layout.leftMargin: 12 + opacity: 0.54 + Layout.minimumHeight: 24 + Layout.minimumWidth: 24 + Layout.preferredHeight: 24 + Layout.preferredWidth: 24 + source: "/components/icons/notes-24px.svg" + } + TextField { + id: taskDescription + Layout.rightMargin: 16 + Layout.leftMargin: 24 + Layout.fillWidth: true + placeholderText: qsTr("Enter task description") + } + } + RowLayout { + id: attachmentLayout + height: 56 + anchors.right: parent.right + anchors.rightMargin: 0 + anchors.left: parent.left + anchors.leftMargin: 0 + anchors.top: taskDescriptionLayout.bottom + anchors.topMargin: 24 + Image { + id: attachmentIcon + sourceSize.height: 24 + sourceSize.width: 24 + Layout.leftMargin: 12 + opacity: 0.54 + Layout.minimumHeight: 24 + Layout.minimumWidth: 24 + Layout.preferredHeight: 24 + Layout.preferredWidth: 24 + source: "/components/icons/attachment-24px.svg" + } + Label { + color: "#000000" + text: qsTr("Attachment") + font.weight: Font.Medium + font.pixelSize: 16 + font.family: "Work Sans" + verticalAlignment: Text.AlignVCenter + Layout.leftMargin: 24 + Layout.fillWidth: true } } } diff --git a/material-design-icons.qrc b/material-design-icons.qrc index e08b3b8..eb90650 100644 --- a/material-design-icons.qrc +++ b/material-design-icons.qrc @@ -1,16 +1,18 @@ <RCC> - <qresource prefix="/"> - <file>components/icons/add-24px.svg</file> - <file>components/icons/arrow-back-24px.svg</file> - <file>components/icons/arrow-forward-24px.svg</file> - <file>components/icons/attachment-24px.svg</file> - <file>components/icons/check-box-outline-24px.svg</file> - <file>components/icons/chevron-right-24px.svg</file> - <file>components/icons/email-24px.svg</file> - <file>components/icons/lock-24px.svg</file> - <file>components/icons/menu-24px.svg</file> - <file>components/icons/photo_camera_24px.svg</file> - <file>components/icons/profile-24px.svg</file> - <file>components/icons/user-24px.svg</file> - </qresource> + <qresource prefix="/"> + <file>components/icons/add-24px.svg</file> + <file>components/icons/arrow-back-24px.svg</file> + <file>components/icons/arrow-forward-24px.svg</file> + <file>components/icons/attachment-24px.svg</file> + <file>components/icons/check-box-outline-24px.svg</file> + <file>components/icons/chevron-right-24px.svg</file> + <file>components/icons/email-24px.svg</file> + <file>components/icons/lock-24px.svg</file> + <file>components/icons/menu-24px.svg</file> + <file>components/icons/photo_camera_24px.svg</file> + <file>components/icons/profile-24px.svg</file> + <file>components/icons/user-24px.svg</file> + <file>components/icons/notes-24px.svg</file> + <file>components/icons/more-vert-24px.svg</file> + </qresource> </RCC> |