Fix instructor tab content layout

There's still something wrong with the image height

2 files changed, 87 insertions, 94 deletions

diff --git a/Course/Detail/Classic/Content/Main/TabContents/Instructor.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Instructor.ui.qml
index 6f231aa..6f4e601 100644
--- a/Course/Detail/Classic/Content/Main/TabContents/Instructor.ui.qml
+++ b/Course/Detail/Classic/Content/Main/TabContents/Instructor.ui.qml
@@ -3,89 +3,87 @@ import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
 import "Instructor"
 
-GridLayout {
-	id: instructorContent
-	width: instructorContent.width
-	height: instructorContent.height
-    rowSpacing: 16
-    columnSpacing: 16
-    flow: GridLayout.TopToBottom
+ColumnLayout {
+
+	FontLoader {
+		id: heebo
+		source: "../../../../../../Heebo/Heebo-Bold.ttf"
+	}
+
+	GridLayout {
+		rows: width < 671.612 ? 2 : 1
+		columns: width < 671.612 ? 1 : 2
+		rowSpacing: 0
+		columnSpacing: 0
 
-	RowLayout {
-		id: instructorStatistics
 		Image {
-			id: instructorImage
-			Layout.preferredWidth: 300
-			Layout.preferredHeight: 300
+			Layout.fillWidth: true
+			Layout.fillHeight: true
 			source: "https://eduport.webestica.com/assets/images/instructor/01.jpg"
 			fillMode: Image.PreserveAspectFit
-			Layout.margins: 8
 		}
+
 		ColumnLayout {
-			id: instructorBody
-			spacing: 8
-			Layout.margins: 8
-			
-			Label {
-				id: instructorFullname
-				color: "#000000"
-				text: qsTr("Instructor Fullname")
-				font.styleName: "Bold"
-				font.pointSize: 32
-				font.family: "roboto"
+			Layout.topMargin: 16
+			Layout.leftMargin: 20
+			Layout.rightMargin: 20
+			Layout.bottomMargin: 16
+			spacing: 0
 
+			Label {
+				text: qsTr("Louis Ferguson")
+				font {
+					family: heebo.name
+					pointSize: 21
+						+ .0075 * parent.parent.width
+				}
 			}
+
 			Label {
-				id: instructorTitle
+				Layout.bottomMargin: 8
 				color: "#66000000"
 				text: qsTr("Instructor of Marketing")
 				font.styleName: "Regular"
-				font.pointSize: 16
+				font.pointSize: 15
 				font.family: "roboto"
 			}
-			RowLayout{
-				spacing: 16
+/*
+			GridLayout {
+				Layout.bottomMargin: 16
+
 				ListInlineItem {
-					id: listInlineItem1
 				}
 				
 				ListInlineItem {
-					id: listInlineItem2
 				}
 				
 				ListInlineItem {
-					id: listInlineItem3
 				}
 				
 				ListInlineItem {
-					id: listInlineItem4
 				}
-				
 			}
+*/
 		}
 	}
-	ColumnLayout {
-		id: insturctorInfo
-        width: instructorStatistics.width
-        spacing: 0
-		Label {
-			color: "#000000"
-			text: qsTr("About Instructor")
-            leftPadding: 8
-			font.styleName: "Medium"
-			font.pointSize: 21
-			font.family: "roboto"
-		}
-		Label {
-			color: "#66000000"
-			width: 720
-			text: qsTr("Fulfilled direction use continual set him propriety continued. Saw met applauded favorite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashboard see frankness objection abilities. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed of add screened rendered six say his striking confined. As it so contrasted oh estimating instrument. Size like body someone had. Are conduct viewing boy minutes warrant the expense? Tolerably behavior may admit daughters offending her ask own. Praise effect wishes change way and any wanted.")
-            wrapMode: Text.WordWrap
-            leftPadding: 8
-			font.styleName: "Regular"
-			font.pointSize: 14
-			font.family: "roboto"
-            Layout.fillWidth: true
+
+	Label {
+		Layout.bottomMargin: 16
+		text: qsTr("About Instructor")
+		font {
+			family: heebo.name
+			pointSize: 20.1 + .0075 * parent.width
 		}
 	}
+
+	Label {
+		Layout.fillWidth: true
+		Layout.bottomMargin: 16
+		color: "#66000000"
+		text: qsTr("Fulfilled direction use continual set him propriety continued. Saw met applauded favorite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashboard see frankness objection abilities. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed of add screened rendered six say his striking confined. As it so contrasted oh estimating instrument. Size like body someone had. Are conduct viewing boy minutes warrant the expense? Tolerably behavior may admit daughters offending her ask own. Praise effect wishes change way and any wanted.")
+		wrapMode: Text.Wrap
+		font.styleName: "Regular"
+		font.pointSize: 14
+		font.family: "roboto"
+	}
 }
diff --git a/Course/Detail/Classic/Content/Main/TabContents/Instructor/ListInlineItem.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Instructor/ListInlineItem.ui.qml
index f2941ed..78cfcb7 100644
--- a/Course/Detail/Classic/Content/Main/TabContents/Instructor/ListInlineItem.ui.qml
+++ b/Course/Detail/Classic/Content/Main/TabContents/Instructor/ListInlineItem.ui.qml
@@ -1,49 +1,44 @@
 import QtQuick 2.15
 import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
-import QtGraphicalEffects 1.12
-
+import QtGraphicalEffects 1.15
 
 RowLayout {
-	id:listInline
-	width: listInlineItem.width
-	height: listInlineItem.height
-	RowLayout {
-		id:listInlineItem
-		Rectangle {
-			id: inlineItemIconBg
-			radius: 100
-			color: "#4dfd7e14"
-			Layout.preferredHeight: 42
-			Layout.preferredWidth: 42
-			Layout.minimumHeight: 42
-			Layout.minimumWidth: 42
-			
-			Image {
-				id: inlineItemIcon
-				anchors.verticalCenter: parent.verticalCenter
-				source: "../../../../../../../Material/svg/filled/school.svg"
-				anchors.horizontalCenter: parent.horizontalCenter
-				fillMode: Image.PreserveAspectFit
-				Layout.preferredHeight: 12
-				Layout.preferredWidth: 12
-				Layout.minimumHeight: 12
-				Layout.minimumWidth: 12
 
-				ColorOverlay{
-					anchors.fill: inlineItemIcon
-					source: inlineItemIcon
-					color: "#fd7e14"
-				}
+	Rectangle {
+		id: inlineItemIconBg
+		radius: 100
+		color: "#4dfd7e14"
+		Layout.preferredHeight: 42
+		Layout.preferredWidth: 42
+		Layout.minimumHeight: 42
+		Layout.minimumWidth: 42
+
+		Image {
+			id: inlineItemIcon
+			anchors.verticalCenter: parent.verticalCenter
+			source: "../../../../../../../Material/svg/filled/school.svg"
+			anchors.horizontalCenter: parent.horizontalCenter
+			fillMode: Image.PreserveAspectFit
+			Layout.preferredHeight: 12
+			Layout.preferredWidth: 12
+			Layout.minimumHeight: 12
+			Layout.minimumWidth: 12
+
+			ColorOverlay {
+				anchors.fill: inlineItemIcon
+				source: inlineItemIcon
+				color: "#fd7e14"
 			}
 		}
-		Label {
-			id: instructorTitle
-			color: "#000000"
-			text: qsTr("List inline item metrics")
-			font.styleName: "Regular"
-			font.pointSize: 14
-			font.family: "roboto"
-		}
+	}
+
+	Label {
+		id: instructorTitle
+		color: "#000000"
+		text: qsTr("List inline item metrics")
+		font.styleName: "Regular"
+		font.pointSize: 14
+		font.family: "roboto"
 	}
 }