diff options
| -rw-r--r-- | DefaultHomeFlickable.ui.qml | 154 |
1 files changed, 98 insertions, 56 deletions
diff --git a/DefaultHomeFlickable.ui.qml b/DefaultHomeFlickable.ui.qml index 83ba02f..e2f89fe 100644 --- a/DefaultHomeFlickable.ui.qml +++ b/DefaultHomeFlickable.ui.qml @@ -1,74 +1,116 @@ import QtQuick 2.15 import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 Flickable { property alias counter: counter property alias popular: popular - contentHeight: counter.height + popular.height + contentHeight: body.height - GridView { - id: counter - interactive: false - - model: ListModel { - ListElement { - icon: "Font-Awesome/svgs/solid/tv.svg" - count: "10K" - title: qsTr("Online Courses") - bgColor: "#26f7c32e" - } - ListElement { - icon: "Font-Awesome/svgs/solid/user-tie.svg" - count: "200+" - title: qsTr("Expert Tutors") - bgColor: "#1a1d3b53" - } - ListElement { - icon: "Font-Awesome/svgs/solid/user-graduate.svg" - count: "60K+" - title: qsTr("Online Students") - bgColor: "#1a6f42c1" - } - ListElement { - icon: "Bootstrap/icons/patch-check-fill.svg" - count: "6K+" - title: qsTr("Certified Courses") - bgColor: "#1a17a2b8" - } - } - - cellWidth: width < 576 ? width : width < 768 ? width / 2 - : width < 992 ? width / 3 : width / 4 - cellHeight: 125.6 - - height: width < 576 ? cellHeight * 4 - : width < 768 ? cellHeight * 3 - : width < 992 ? cellHeight * 2 : cellHeight + ColumnLayout { + id: body anchors { top: parent.top left: parent.left right: parent.right } - } - GridView { - id: popular - interactive: false + ToolBar { + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + layoutDirection: Qt.RightToLeft + ToolButton { + onClicked: optionsMenu.open() + Menu { + id: optionsMenu + y: parent.height + Action { + text: qsTr("Edit Profile") + } + Action { + text: qsTr("Account Settings") + } + Action { + text: qsTr("Help") + } + Action { + text: qsTr("Sign Out") + } + Action { + text: qsTr("Dark Mode") + } + } + } + } + } - cellWidth: width < 576 ? width - : width < 768 ? width / 2 - : width < 992 ? width / 3 - : width / 4 - cellHeight: cellWidth * 1.3 + Item { + implicitHeight: counter.height + popular.height + Layout.fillWidth: true - height: width < 576 ? cellHeight * count - : width < 768 ? cellHeight * count / 2 - : width < 992 ? cellHeight * count / 3 - : cellHeight * count / 4 - anchors { - top: counter.bottom - left: parent.left - right: parent.right + GridView { + id: counter + interactive: false + cellWidth: width < 576 ? width + : width < 1200 ? width / 2 + : width / 4 + cellHeight: 125.6 + height: width < 576 ? cellHeight * count + : width < 1200 ? cellHeight * count / 2 + : cellHeight + anchors { + top: parent.top + left: parent.left + right: parent.right + } + + model: ListModel { + ListElement { + icon: "Font-Awesome/svgs/solid/tv.svg" + count: "10K" + title: qsTr("Online Courses") + bgColor: "#26f7c32e" + } + ListElement { + icon: "Font-Awesome/svgs/solid/user-tie.svg" + count: "200+" + title: qsTr("Expert Tutors") + bgColor: "#1a1d3b53" + } + ListElement { + icon: "Font-Awesome/svgs/solid/user-graduate.svg" + count: "60K+" + title: qsTr("Online Students") + bgColor: "#1a6f42c1" + } + ListElement { + icon: "Bootstrap/icons/patch-check-fill.svg" + count: "6K+" + title: qsTr("Certified Courses") + bgColor: "#1a17a2b8" + } + } + } + + GridView { + id: popular + interactive: false + cellWidth: width < 576 ? width + : width < 768 ? width / 2 + : width < 992 ? width / 3 + : width / 4 + cellHeight: cellWidth * 1.3 + height: width < 576 ? cellHeight * count + : width < 768 ? cellHeight * count / 2 + : width < 992 ? cellHeight * count / 3 + : cellHeight * count / 4 + anchors { + top: counter.bottom + left: parent.left + right: parent.right + } + } } } } |