From cac18aed8789f53d1208e8a21433c7ae1414dc26 Mon Sep 17 00:00:00 2001
From: sachinganesh <sachin.ganesh@bizgaze.in>
Date: Fri, 20 Jan 2023 11:53:29 +0530
Subject: [PATCH] code added

---
 dist/css/main.css                  | 32 ++++++++++++++++++++++++++++++
 dist/css/pages/productOverview.css | 28 ++++++++++++++++++++++++++
 dist/html/pages/laptopmulti.html   | 21 ++++++++++++++++----
 scss/base/_utilities.scss          | 28 ++++++++++++++++++++++++++
 scss/pages/productOverview.scss    | 27 ++++++++++++++++++++++++-
 5 files changed, 131 insertions(+), 5 deletions(-)
 create mode 100644 dist/css/pages/productOverview.css

diff --git a/dist/css/main.css b/dist/css/main.css
index d53fd28..1a9ecf7 100644
--- a/dist/css/main.css
+++ b/dist/css/main.css
@@ -41,6 +41,15 @@ body {
 .font-1_5 {
   font-size: 2rem; }
 
+.font-1_7 {
+  font-size: 1.7rem; }
+
+.font-2 {
+  font-size: 2.2rem; }
+
+.font-2_2 {
+  font-size: 2.2rem; }
+
 .subtitle_1 {
   font-size: 1.5rem; }
 
@@ -53,6 +62,9 @@ body {
 .padding_top_14 {
   padding-top: 14rem; }
 
+.p-6 {
+  padding: 5rem; }
+
 .vh_60 {
   height: 60vh; }
 
@@ -65,6 +77,9 @@ body {
 .vh-15 {
   height: 15vh; }
 
+.fw-600 {
+  font-weight: 600; }
+
 .button_dark {
   clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0);
   padding-right: 1.7rem;
@@ -83,3 +98,20 @@ body {
 
 .priceCut_multi {
   font-size: .7rem; }
+
+.productOverview .overviewProductHeading {
+  font-size: 2.1rem; }
+
+.productOverview .overviewProductFullTitle {
+  padding: 2rem 13rem;
+  font-size: 3rem; }
+
+.productOverview .overviewProductDes {
+  padding: 0 2rem;
+  font-size: 1.5rem; }
+
+.PO_galleryContainer .PO_gallery_display {
+  min-height: 500px;
+  width: 100%;
+  background: white;
+  background: linear-gradient(180deg, white 7%, #ff8e9e4d 52%, #eb869478 100%); }
diff --git a/dist/css/pages/productOverview.css b/dist/css/pages/productOverview.css
new file mode 100644
index 0000000..77d2ef4
--- /dev/null
+++ b/dist/css/pages/productOverview.css
@@ -0,0 +1,28 @@
+.photo_dual {
+  width: 40rem; }
+
+.price_footer {
+  background-color: #52cba5; }
+
+.boxImgContainer {
+  width: 4rem; }
+
+.priceCut_multi {
+  font-size: .7rem; }
+
+.productOverview .overviewProductHeading {
+  font-size: 2.1rem; }
+
+.productOverview .overviewProductFullTitle {
+  padding: 2rem 13rem;
+  font-size: 3rem; }
+
+.productOverview .overviewProductDes {
+  padding: 0 2rem;
+  font-size: 1.5rem; }
+
+.PO_galleryContainer .PO_gallery_display {
+  min-height: 500px;
+  width: 100%;
+  background: white;
+  background: linear-gradient(180deg, white 7%, #ff8e9e4d 52%, #eb869478 100%); }
diff --git a/dist/html/pages/laptopmulti.html b/dist/html/pages/laptopmulti.html
index b6cb782..fa75847 100644
--- a/dist/html/pages/laptopmulti.html
+++ b/dist/html/pages/laptopmulti.html
@@ -66,16 +66,29 @@
 
     </header>
     <section class="productOverview container">
-        <div class=" d-flex align-items-center container justify-content-between">
-            <div>Overview</div>
-            <div>The Laptop of tomorrow with
+        <div class=" d-flex flex-column p-6  align-items-center container justify-content-between">
+            <div class="font-1_7 overviewProductHeading fw-600">Overview</div>
+            <div class="font-2_2 text-center fw-bold overviewProductFullTitle">The Laptop of tomorrow with
                 4K OLED Dual Screen for Creative Multitasking</div>
-            <div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
+            <div class="overviewProductDes">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
                 invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit
                 amet, consetetur sadipscing elitr, sed diam nonumy eirmod</div>
         </div>
     </section>
 
+    <!-- photos display -->
+    <div class="container PO_galleryContainer">
+        <div class="p-6 pt-0">
+            <div class="PO_gallery_display">
+               <img src="./../../assets/" />
+            </div>
+            <div>
+                box
+            </div>
+        </div>
+    </div>
+
+    <!-- photos display end -->
     <!-- footer -->
     <div id="footer-head"></div>
     <!-- end-footer -->
diff --git a/scss/base/_utilities.scss b/scss/base/_utilities.scss
index 3eeeb4b..df7a7a1 100644
--- a/scss/base/_utilities.scss
+++ b/scss/base/_utilities.scss
@@ -12,6 +12,20 @@
   font-size: 2rem;
 }
 
+.font-1_7{
+  font-size: 1.7rem;
+}
+
+.font-2{
+  font-size: 2.2rem;
+}
+
+.font-2_2{
+  font-size: 2.2rem;
+}
+
+
+
 .subtitle_1 {
   font-size: 1.5rem;
 }
@@ -31,6 +45,13 @@
   padding-top: 14rem;
 }
 
+.p-6{
+  padding:5rem;
+}
+
+
+
+
 // heights
 
 .vh_60{
@@ -48,3 +69,10 @@
 .vh-15 {
   height: 15vh;
 }
+
+
+// font weight
+
+.fw-600{
+  font-weight: 600;
+}
\ No newline at end of file
diff --git a/scss/pages/productOverview.scss b/scss/pages/productOverview.scss
index d7ed39c..352b6eb 100644
--- a/scss/pages/productOverview.scss
+++ b/scss/pages/productOverview.scss
@@ -16,4 +16,29 @@
   .priceCut_multi{
     font-size: .7rem;
   }
-  
\ No newline at end of file
+  
+.productOverview{
+  .overviewProductHeading{
+    font-size: 2.1rem;
+  }
+
+  .overviewProductFullTitle{
+    padding: 2rem 13rem;
+    font-size: 3rem;
+  }
+
+  .overviewProductDes{
+    padding: 0 2rem;
+    font-size: 1.5rem;
+  }
+}
+
+.PO_galleryContainer{
+  .PO_gallery_display{
+    min-height: 500px;
+    width: 100%;
+
+    background: rgb(255,255,255);
+    background: linear-gradient(180deg, white 7%, #ff8e9e4d 52%, #eb869478 100%);
+  }
+}
\ No newline at end of file