diff --git a/dist/Js/laptopmuti.js b/dist/Js/laptopmuti.js new file mode 100644 index 0000000..eea7823 --- /dev/null +++ b/dist/Js/laptopmuti.js @@ -0,0 +1,14 @@ +function callGallery(){ + $('.PO_gallery_box').each(function(i,el){ + $(el).click(function(e){ + const src = $(e.target).attr('src'); + $('.PO_gallery_display_img').attr('src',src) + }); + }); +} + +function callMain(){ + callGallery(); +} + +callMain(); \ No newline at end of file diff --git a/dist/assets/imgs/productoverview/ossoftware.png b/dist/assets/imgs/productoverview/ossoftware.png new file mode 100644 index 0000000..9763d3e Binary files /dev/null and b/dist/assets/imgs/productoverview/ossoftware.png differ diff --git a/dist/html/pages/allinone.html b/dist/html/pages/allinone.html index 7262dad..e904ea0 100644 --- a/dist/html/pages/allinone.html +++ b/dist/html/pages/allinone.html @@ -522,7 +522,7 @@ - + diff --git a/dist/html/pages/laptopmulti.html b/dist/html/pages/laptopmulti.html index ed077de..0f64a90 100644 --- a/dist/html/pages/laptopmulti.html +++ b/dist/html/pages/laptopmulti.html @@ -12,7 +12,7 @@ project - +
@@ -36,9 +36,9 @@ -
-
-
+
+
+
box
@@ -48,8 +48,8 @@
entering your PIN code
-
-
+
+
$69,999.00
$ 89,999
Overview
-
The Laptop of tomorrow with - 4K OLED Dual Screen for Creative Multitasking
-
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
+
+
Perform. Produce.
+
+ Only the Perfects +
+ +
+
Powered by up to 11th Gen Intel® Core™ i7-10850H Processor and a refresh rate of up to 120 Hz, Performance will not be a problem. Embedded with 16 Gb DDr4 Memory series and up to 1TB M.2 NVme storage Anwi Xseries Laptop is a high throughput laptop with increased Clock speed, memory bandwidth, and effective data transfers with very minimal power consumption.
@@ -125,7 +127,7 @@
-
+
- +
- Latest 11th + Intel® Core™ i7
-
Gen Intel Core +
11th Gen
-
i5/i7 H35
+
Processor
@@ -282,7 +284,7 @@
-
+
-
+
- Display / Screenpad + Two Screens
-

TWO SCREENS.

-

ZERO BOUNDARIES

+ +

To Display +

+

True Colors

-

2.5k QHD +

-

Anwi Truelife Display

+

2k FHD

+

Anwi Truelife Display

Witness never before like visuals on the "2.5K (QHD+) Mi TrueLife @@ -605,9 +602,9 @@

-

Customize

-

your workflow

-

with Control Panel

+

Peripheral

+

Artwork

+

Studio

    @@ -722,7 +719,7 @@
--> -
+

Designed for

@@ -762,7 +759,7 @@
-
+

Popup

@@ -777,7 +774,7 @@
- popupkeyboard + popupkeyboard
@@ -788,15 +785,14 @@

- 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 + Designed for Professional creators & illustrators to flex their creative muscles with spectacular style-frame settings with on-point Precision to develop any kind of artistic project. From high-end visuals to animation, Digital Sculpting to 3D modeling or illustration creations, the designer can swing through unwraps and textures very swiftly. +

-
*as compared to a 14 inch FHD display
+
*as compared to a 14 inch FHD display
-

Anwi Roxo Display

+

Anwi Roxo Display

@@ -896,13 +892,15 @@

- Professional-grade + Blitz through every and any routine +

-

graphics

+

graphics

- 2x performance over 10th Gen Iris Plus graphics, redefining thin and light laptop graphics Trade blows - with NVidia MX350 / MX450 Play 100s of PC games + A perfect companion for anyone who desires to elevate their computing experience with exceptional performance. + The Anwi Xseries Laptop is a true powerhouse of performance, designed to efficiently handle even the most demanding tasks. Effortlessly multitask and experience smooth visuals thanks to the 16 GB of DDR4 memory and 1 TB of M.2 NVme storage. Equipped with the latest 11th Gen Intel® Core™ i7-10850H Processor and an impressive 120 Hz refresh rate, this laptop is tailored for power users, gamers, and professionals who demand the best. +

@@ -925,12 +923,12 @@
-->
-

Stuning

-

Sound

-

Stuning Sound

+

Acoustics, Astounding!

+
-
+

2x performance over 10th Gen Iris Plus graphics, redefining thin and light laptop graphics Trade blows with NVidia MX350 / MX450 Play 100s of PC games

@@ -942,26 +940,31 @@
+ +
+

Encompass Yourself In Pulsating Resonates +

+
- +
-

+

- Wider; + Newfangled

-

Faster Internet

+

Connectivity

-
+

2x performance over 10th Gen Iris Plus graphics, redefining thin and light laptop graphics Trade blows with NVidia MX350 / MX450 Play 100s of PC games

@@ -980,19 +983,20 @@ -
+
ports
-
+
-

Pro Connectivity

+

Pro Connectivity

-

Connect up to two external 4K displays or one 8K display or an eGPU via - Thunderbolt 4. Experience blazing fast data transmission speedsand charging support on both - Thunderbolt 4 and Type C ports. +

Engineered with WiFi 6 network protocol for improved connectivity and to benefit more from the advantage of frequency bands. +

+

WiFi 6 is complemented by v5.3 Bluetooth technology. +

@@ -1002,7 +1006,7 @@ -
+ -
-
+
+
+ +
+

OS+

Software

-
Window 11 Home
-
Microsoft Office Home and Student Edition
-
Anwi Smart Share
-
-
- +
Window 11 Home
+
Microsoft Office Home and Student Edition
+
Anwi Smart Share
+
- + + diff --git a/styles/base/_base.scss b/styles/base/_base.scss index 246500e..88da004 100644 --- a/styles/base/_base.scss +++ b/styles/base/_base.scss @@ -1,10 +1,4 @@ -*, -*::after, -*::before { - margin: 0; - padding: 0; - box-sizing: inherit; -} + // html { // font-size: 62.5%; diff --git a/styles/pages/_productOverview.scss b/styles/pages/_productOverview.scss index 38b42a2..3d10776 100644 --- a/styles/pages/_productOverview.scss +++ b/styles/pages/_productOverview.scss @@ -1,3 +1,6 @@ +.productOverviewBody{ + overflow-x: hidden; +} .productoverviewmain { background-image: url("../../dist/assets/imgs/productoverview/productbg.png"); background-color: white; @@ -23,10 +26,21 @@ $PO_footerText: 0.7rem; border: 1px solid rgba(255, 255, 255, 0.18); border: 2px solid; - position: absolute; + position: fixed; z-index: 999; bottom: 0; left: 0; + + .price_footerContainer{ + // padding-left: 3rem; + // padding-right: 3rem; + } +} + +@media (max-width:768px){ + .footerDesText{ + width: 100%; + } } .boxImgContainer { @@ -386,65 +400,7 @@ $PO_footerText: 0.7rem; background-position: center; } -.controlPanel { - margin-top: 10rem; - padding-bottom: 300px; - .controlPanel_des { - position: absolute; - top: -170px; - left: 80px; - } - - .bgControlpanel { - min-height: 100vh; - background-color: #ececec; - border-radius: 157px; - position: relative; - - .bgControlpaneltabs { - position: absolute; - top: 100px; - right: 0; - - .nav-tabs { - border-bottom: 1px solid; - margin-bottom: 2rem; - } - - .nav-item { - position: relative; - border: none; - } - - .nav-tabs .nav-link { - position: relative; - color: black; - font-weight: 500; - } - - .nav-tabs .nav-link.active { - border: none; - background-color: transparent; - } - - .nav-tabs .nav-link.active::before { - display: block; - } - - .nav-item .nav-link::before { - content: ""; - position: absolute; - width: 100%; - height: 5px; - bottom: -2px; - right: 0; - display: none; - background-color: black; - } - } - } -} @@ -504,38 +460,6 @@ $PO_footerText: 0.7rem; } } -.osPlusSoftware { - width: 100vw; - height: 140vh; - margin-top: 14rem; - - .osContianer { - position: relative; - width: 100%; - height: 100%; - border-radius: 30%; - - .osContianer_des_fontParent { - position: relative; - top: -8%; - } - - .osContianer_des_font { - font-size: 2rem; - font-weight: 600; - } - - .osContianerHeading { - position: relative; - top: -15%; - } - - .osContianerImg { - position: absolute; - bottom: 0; - } - } -} @media (max-width:1200px) { diff --git a/styles/pages/productOverview/_controlPanel.scss b/styles/pages/productOverview/_controlPanel.scss new file mode 100644 index 0000000..58eee1d --- /dev/null +++ b/styles/pages/productOverview/_controlPanel.scss @@ -0,0 +1,69 @@ +.controlPanel { + margin-top: 10rem; + padding-bottom: 300px; + + .controlPanel_des { + position: absolute; + top: -170px; + left: 80px; + } + + .bgControlpanel { + min-height: 100vh; + background-color: #ececec; + border-radius: 157px; + position: relative; + + .bgControlpaneltabs { + position: absolute; + top: 100px; + right: 0; + + .nav-tabs { + border-bottom: 1px solid; + margin-bottom: 2rem; + } + + .nav-item { + position: relative; + border: none; + } + + .nav-tabs .nav-link { + position: relative; + color: black; + font-weight: 500; + } + + .nav-tabs .nav-link.active { + border: none; + background-color: transparent; + } + + .nav-tabs .nav-link.active::before { + display: block; + } + + .nav-item .nav-link::before { + content: ""; + position: absolute; + width: 100%; + height: 5px; + bottom: -2px; + right: 0; + display: none; + background-color: black; + } + } + } + } + + @media (max-width:768px) { + .controlPanel{ + padding-bottom: 100px; + .bgControlpanel{ + min-height: 50vh; + } + + } + } \ No newline at end of file diff --git a/styles/pages/productOverview/_osPlusSoftware.scss b/styles/pages/productOverview/_osPlusSoftware.scss new file mode 100644 index 0000000..b31074a --- /dev/null +++ b/styles/pages/productOverview/_osPlusSoftware.scss @@ -0,0 +1,76 @@ +.osPlusSoftware { + position: relative; + padding-top: 10rem; + .osContianer{ + position: absolute; + top: 5rem; + + left: 50%; + transform: translateX(-50%); + } + + .osContianer_des_font{ + font-size: 1.5rem; + } + } + + + @media (max-width:1200px) { + .osPlusSoftware { + position: relative; + + .osContianer{ + + } + + .osContianerHeading{ + >h1{ + font-size: 5rem; + } + } + + .osContianer_des_font{ + font-size: 1.5rem; + } + } + } + + + @media (max-width:1000px){ + .osPlusSoftware{ + padding-top: 1rem; + .osContianer{ + top: 1rem; + } + .osContianerHeading{ + >h1{ + font-size: 2rem; + text-align: center; + } + } + + .osContianer_des_font{ + font-size: 1rem; + } + } + } + + @media (max-width:768px){ + .osPlusSoftware{ + .osContianer{ + top: -1rem; + } + + .osContianerHeading{ + >h1{ + font-size: 2rem; + text-align: center; + } + } + + .osContianer_des_font{ + font-size: 0.7rem; + text-align: center; + } + } + } \ No newline at end of file diff --git a/styles/pages/productOverview/_proConnectivity.scss b/styles/pages/productOverview/_proConnectivity.scss new file mode 100644 index 0000000..2eef0a3 --- /dev/null +++ b/styles/pages/productOverview/_proConnectivity.scss @@ -0,0 +1,49 @@ +.proConnectivity{ + +} + + +@media (max-width:1200px) { + + .proConnectivity{ + h1{ + font-size: 2.5rem; + } + + .font_p_Dual{ + font-size: 1rem; + } + + } +} + +@media (max-width:768px) { + .proConnectivity{ + h1{ + font-size: 2rem; + } + + .font_p_Dual{ + font-size: 0.7rem; + } + + } +} + +@media (max-width:600px) { + .proConnectivity{ + // h1{ + // font-size: 2rem; + // } + + .connectivityPso_des{ + padding: 2rem; + } + + .font_p_Dual{ + + + } + + } +} \ No newline at end of file diff --git a/styles/pages/productOverview/_wifisection.scss b/styles/pages/productOverview/_wifisection.scss index 5c2320f..0d4813c 100644 --- a/styles/pages/productOverview/_wifisection.scss +++ b/styles/pages/productOverview/_wifisection.scss @@ -30,7 +30,7 @@ .textWifiContainerHeading { >h1 { - font-size: 8rem; + font-size: 5rem; } } } diff --git a/styles/style.scss b/styles/style.scss index 85b6a28..422fe6f 100644 --- a/styles/style.scss +++ b/styles/style.scss @@ -16,6 +16,9 @@ @import "pages/productOverview/stunningsound"; @import "pages/productOverview/wifisection"; @import "pages/productOverview/tablesection"; +@import "pages/productOverview/proConnectivity"; +@import "pages/productOverview/osPlusSoftware"; +@import "pages/productOverview/controlPanel"; @import "pages/home"; @import "pages/shopping-cart"; @@ -106,11 +109,7 @@ ORDER: Base + typography > general layout + grid > page layout > components } -/* Satoshi end */ -.satoshi_font { - font-family: "Satoshi", sans-serif; -} html { font-size: 100%;