summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--Counter.ui.qml47
-rw-r--r--HomeDefault.ui.qml253
2 files changed, 144 insertions, 156 deletions
diff --git a/Counter.ui.qml b/Counter.ui.qml
index e6e7318..f75b2ce 100644
--- a/Counter.ui.qml
+++ b/Counter.ui.qml
@@ -3,39 +3,39 @@ import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
Item {
- property alias area: area
-
Rectangle {
color: bgColor
radius: 8
anchors {
- top: parent.top
+ fill: parent
topMargin: 25.6
- left: parent.left
leftMargin: 12.8
- right: parent.right
rightMargin: 12.8
- bottom: parent.bottom
}
- RowLayout {
+ Item {
anchors {
- top: parent.top
- topMargin: 25.6
- left: parent.left
- leftMargin: 25.6
- right: parent.right
- rightMargin: 25.6
- bottom: parent.bottom
- bottomMargin: 25.6
+ fill: parent
+ margins: 25.6
}
Image {
+ id: image
source: icon
- sourceSize.height: parent.height
+ sourceSize.height: column.height * 3 / 4
+ fillMode: Image.PreserveAspectFit
+ x: (parent.width - (width + column.width + 25.6)) / 2
+ anchors.verticalCenter: parent.verticalCenter
}
ColumnLayout {
+ id: column
+ spacing: 0
+ anchors {
+ left: image.right
+ leftMargin: 25.6
+ }
+
FontLoader {
id: bold
source: "Heebo/Heebo-Bold.ttf"
@@ -45,28 +45,27 @@ Item {
text: count
font {
family: bold.name
- pixelSize: 21
+ pointSize: 20.1
+ weight: Font.Bold
}
+ Layout.fillWidth: true
}
FontLoader {
id: medium
- source: "Heebo/Heebo-Bold.ttf"
+ source: "Heebo/Heebo-Medium.ttf"
}
Label {
text: title
font {
family: medium.name
- pixelSize: 15
+ pointSize: 15
+ weight: Font.Medium
}
+ Layout.fillWidth: true
}
}
}
-
- MouseArea {
- id: area
- anchors.fill: parent
- }
}
}
diff --git a/HomeDefault.ui.qml b/HomeDefault.ui.qml
index 4aa79cb..438cd8f 100644
--- a/HomeDefault.ui.qml
+++ b/HomeDefault.ui.qml
@@ -1,6 +1,7 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.15
Flickable {
property alias counter: counter
@@ -25,11 +26,17 @@ Flickable {
id: banner
columns: width < 992 ? 1 : 2
rows: width < 992 ? 2 : 1
- Layout.topMargin: 48
- Layout.leftMargin: 51.28
- Layout.rightMargin: 51.28
+ Layout.leftMargin: -9
+ Layout.rightMargin: -9
+ Layout.bottomMargin: 48
ColumnLayout {
+ Layout.topMargin: 48
+ Layout.leftMargin: 15
+ Layout.rightMargin: 15
+ Layout.bottomMargin: 48
+ Layout.maximumWidth: body.width < 992
+ ? body.width : body.width / 2
FontLoader {
id: heebo
@@ -109,16 +116,42 @@ Flickable {
}
}
- ColumnLayout {
+ Item {
Layout.topMargin: 48
Layout.leftMargin: 24
Layout.rightMargin: 24
+ Layout.fillWidth: true
+ implicitHeight: image.height
+
+ DropShadow {
+ source: angularRectangle
+ anchors.fill: angularRectangle
+ color: Qt.rgba(.113, .227, .325, .15)
+ }
+
+ Rectangle {
+ id: angularRectangle
+ radius: 8
+ implicitWidth: angularImage.width + 16
+ implicitHeight: angularImage.height + 16
+ anchors {
+ top: parent.top
+ right: parent.right
+ rightMargin: 24
+ }
+
+ Image {
+ id: angularImage
+ source: "https://eduport.webestica.com/assets/images/client/angular.svg"
+ anchors.centerIn: parent
+ }
+ }
Image {
id: image
source: "https://eduport.webestica.com/assets/images/element/07.png"
+ width: parent.width
fillMode: Image.PreserveAspectFit
- Layout.fillWidth: true
}
}
}
@@ -131,7 +164,7 @@ Flickable {
: width / 4
cellHeight: 125.6
Layout.fillWidth: true
- Layout.preferredHeight: width < 576
+ implicitHeight: width < 576
? cellHeight * count
: width < 1200 ? cellHeight * count / 2
: cellHeight
@@ -162,152 +195,108 @@ Flickable {
bgColor: "#1a17a2b8"
}
}
+
+ delegate: Counter {
+ implicitWidth: counter.cellWidth
+ implicitHeight: counter.cellHeight
+ }
}
ColumnLayout {
+ Layout.topMargin: 64
Layout.leftMargin: 15
Layout.rightMargin: 15
- Layout.bottomMargin: 25.6
+ Layout.bottomMargin: 48
- Label {
- text: qsTr("Most Popular Courses")
- color: "#24292d"
- horizontalAlignment: Text.AlignHCenter
- wrapMode: Text.Wrap
- Layout.fillWidth: true
- Layout.bottomMargin: 8
- font {
- family: heebo.name
- pointSize: 22.5 + .020625 * width
- }
- }
+ ColumnLayout {
+ Layout.bottomMargin: 25.6
- Label {
- text: qsTr("Choose from hundreds of courses from specialist organizations")
- color: "#747579"
- horizontalAlignment: Text.AlignHCenter
- wrapMode: Text.Wrap
- Layout.fillWidth: true
- font {
- family: doesntEmbed ? "Roboto"
- : roboto.name
- pointSize: 15
+ Label {
+ text: qsTr("Most Popular Courses")
+ color: "#24292d"
+ horizontalAlignment: Text.AlignHCenter
+ wrapMode: Text.Wrap
+ Layout.fillWidth: true
+ Layout.bottomMargin: 8
+ font {
+ family: heebo.name
+ pointSize: 22.5 + .020625 * width
+ }
}
- }
- }
-
- TabBar {
- id: tabs
- currentIndex: tabsContent.currentIndex
- background: Rectangle{
- color: Qt.rgba(.0235, .416, .788, .1)
- radius: 10
- }
- horizontalPadding: 16
- verticalPadding: 10
- Layout.fillWidth: true
- Layout.bottomMargin: 25.6
- TabButton {
- id: webDesign
- text: qsTr("Web Design")
- horizontalPadding: 16
- verticalPadding: 8
- anchors {
- rightMargin: 8
- bottomMargin: 8
- }
- background: Rectangle {
- color: "#066ac9"
- radius: 5.2
+ Label {
+ text: qsTr("Choose from hundreds of courses from specialist organizations")
+ color: "#747579"
+ horizontalAlignment: Text.AlignHCenter
+ wrapMode: Text.Wrap
+ Layout.fillWidth: true
+ font {
+ family: doesntEmbed ? "Roboto" : roboto.name
+ pointSize: 15
+ }
}
}
- TabButton {
- id: development
- text: qsTr("Development")
- horizontalPadding: 16
- verticalPadding: 8
- anchors {
- rightMargin: 8
- bottomMargin: 8
- }
- background: Rectangle {
- color: "#066ac9"
- radius: 5.2
+ TabBar {
+ id: tabs
+ currentIndex: tabsContent.currentIndex
+ background: Rectangle{
+ color: Qt.rgba(.0235, .416, .788, .1)
+ radius: 10
}
- }
-
- TabButton {
- id: graphicDesign
- text: qsTr("Graphic Design")
horizontalPadding: 16
- verticalPadding: 8
- anchors {
- rightMargin: 8
- bottomMargin: 8
- }
- background: Rectangle {
- color: "#066ac9"
- radius: 5.2
- }
- }
+ verticalPadding: 10
+ Layout.fillWidth: true
+ Layout.bottomMargin: 25.6
- TabButton {
- id: marketing
- text: qsTr("Marketing")
- horizontalPadding: 16
- verticalPadding: 8
- anchors {
- rightMargin: 8
- bottomMargin: 8
- }
- background: Rectangle {
- color: "#066ac9"
- radius: 5.2
- }
- }
+ Repeater {
+ model: ["Web Design", "Development",
+ "Graphic Design",
+ "Marketing", "Finance"]
- TabButton {
- id: finance
- text: qsTr("Finance")
- horizontalPadding: 16
- verticalPadding: 8
- anchors {
- rightMargin: 8
- bottomMargin: 8
- }
- background: Rectangle {
- color: "#066ac9"
- radius: 5.2
+ TabButton {
+ text: modelData
+ horizontalPadding: 16
+ verticalPadding: 8
+ width: Math.max(124,
+ tabs.width / 5)
+ anchors {
+ rightMargin: 8
+ bottomMargin: 8
+ }
+ background: Rectangle {
+ color: "#066ac9"
+ radius: 5.2
+ }
+ }
}
}
- }
- StackLayout {
- id: tabsContent
- currentIndex: tabs.currentIndex
- Layout.preferredHeight: popular.height
+ StackLayout {
+ id: tabsContent
+ currentIndex: tabs.currentIndex
+ Layout.preferredHeight: popular.height
- GridView {
- id: popular
- interactive: false
- Layout.fillWidth: true
- 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 + count % 2) / 2
- : width < 992
- ? cellHeight
- * (count + (count + 1) % 3) / 3
- : cellHeight
- * (count + (count + 2) % 4) / 4
+ GridView {
+ id: popular
+ interactive: false
+ Layout.fillWidth: true
+ 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 + count % 2) / 2
+ : width < 992
+ ? cellHeight
+ * (count + (count + 1) % 3) / 3
+ : cellHeight
+ * (count + (count + 2) % 4) / 4
+ }
}
}
}
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-01 14:30:10 +0000