Header cart button

4 files changed, 50 insertions, 0 deletions

diff --git a/Bootstrap/icons/cart3.svg b/Bootstrap/icons/cart3.svg
new file mode 100644
index 0000000..2187149
--- /dev/null
+++ b/Bootstrap/icons/cart3.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cart3" viewBox="0 0 16 16">
+  <path d="M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .49.598l-1 5a.5.5 0 0 1-.465.401l-9.397.472L4.415 11H13a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM3.102 4l.84 4.479 9.144-.459L13.89 4H3.102zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
+</svg>
\ No newline at end of file
diff --git a/Eduport.qrc b/Eduport.qrc
index 61278a6..bbd82fa 100644
--- a/Eduport.qrc
+++ b/Eduport.qrc
@@ -11,6 +11,7 @@
 		<file>Bootstrap/icons/power.svg</file>
 		<file>Bootstrap/icons/sun.svg</file>
 		<file>Bootstrap/icons/moon-stars.svg</file>
+		<file>Bootstrap/icons/cart3.svg</file>
 		<file>Button/Sm.ui.qml</file>
 		<file>Button/Btn.ui.qml</file>
 		<file>Button/Primary.ui.qml</file>
diff --git a/Header.ui.qml b/Header.ui.qml
index bf76de1..4cc507d 100644
--- a/Header.ui.qml
+++ b/Header.ui.qml
@@ -9,6 +9,7 @@ import "Label" as Lbl
 
 ToolBar {
 	property alias logo: logo
+	property alias cart: cart
 	property alias profile: profile
 	property string imageSource: "https://eduport.webestica.com/assets/images/avatar/01.jpg"
 	property alias menu: menu
@@ -78,6 +79,50 @@ ToolBar {
 	}
 
 	ToolButton {
+		id: cart
+		padding: 0
+		width: 40
+		height: 40
+		anchors {
+			right: profile.left
+			rightMargin: 12
+			verticalCenter: parent.verticalCenter
+		}
+		layer {
+			enabled: true
+			effect: OpacityMask {
+				maskSource: Rectangle {
+					width: 40
+					height: 40
+					radius: 40
+				}
+			}
+		}
+		contentItem: Item {
+
+			Image {
+				anchors.centerIn: parent
+				source: "Bootstrap/icons/cart3.svg"
+				sourceSize.width: 18
+				fillMode: Image.PreserveAspectFit
+
+				ColorOverlay {
+					color: Eduport.bsGray900
+					source: parent
+					anchors.fill: parent
+				}
+			}
+		}
+		background: Rectangle {
+			color: Eduport.bsLight
+			border {
+				color: Eduport.bsLight
+				width: 1
+			}
+		}
+	}
+
+	ToolButton {
 		id: profile
 		padding: 0
 		anchors {
diff --git a/imports/Eduport/Eduport.qml b/imports/Eduport/Eduport.qml
index 85ff011..f9cfe9d 100644
--- a/imports/Eduport/Eduport.qml
+++ b/imports/Eduport/Eduport.qml
@@ -125,6 +125,7 @@ QtObject {
 	property color bsGray600: mode ? "#c5c6cc" : "#747579"
 	property color bsGray700: mode ? "#f3f1f1" : "#404448"
 	property color bsGray800: mode ? "#f7f5f5" : "#24292d"
+	property color bsGray900: mode ? "#ffffff" : "#0b0f13"
 
 	readonly property bool haveRoboto: Qt.platform.os === "android"
 					|| Qt.platform.os === "linux"