From 03b94c52a31f5ea3a23cc2aa829ecff510975189 Mon Sep 17 00:00:00 2001 From: roee zach Date: Mon, 12 Jun 2023 13:42:11 +0300 Subject: [PATCH 1/4] Revert "Merge pull request #37 from CoffeeShopTeam/Etai/static-ui/checkout" This reverts commit d4239476fcbb1f95dd6a44464f9b3f68610e2bc9, reversing changes made to 151a7611747e22feacb48653f1f9c7c82dc418ba. --- src/views/layouts/Cart/Cart.html | 26 ++++++++++++-------------- 1 file changed, 12 insertions(+), 14 deletions(-) diff --git a/src/views/layouts/Cart/Cart.html b/src/views/layouts/Cart/Cart.html index f309b72..e29855f 100644 --- a/src/views/layouts/Cart/Cart.html +++ b/src/views/layouts/Cart/Cart.html @@ -30,7 +30,7 @@
-

Urusta.

+

Urusta.

@@ -41,17 +41,14 @@

Urusta.

-

Our Story

+

Our Story

-
- -
alt text + class="header0__image10" onclick="alert(`It is clickable`)" />
@@ -61,7 +58,7 @@

Our Story

alt text + class="header0__icon" onclick="alert(`It is clickable`)" />
@@ -168,7 +165,7 @@
+
-
+

UPDATE CART

@@ -178,7 +175,7 @@

UPDATE CART

-
+

APPLY COUPON

@@ -236,7 +233,7 @@
POST CODE / ZIP
-
+

UPDATE TOTALS

@@ -269,11 +266,11 @@

-
CONTACT
+
CONTACT
-
TERMS OF SERVICES
+
TERMS OF SERVICES
-
SHIPPING AND RETURNS
+
SHIPPING AND RETURNS
© 2023 MadMach.
A clickable arrow to submit email + alt="A clickable arrow to submit email" class="footer__image1" + onclick="alert(`It is clickable`)" />
From ba9caee11829e55941596cb001ffbb7763b4fb4d Mon Sep 17 00:00:00 2001 From: roee zach Date: Mon, 12 Jun 2023 13:46:22 +0300 Subject: [PATCH 2/4] Revert "Merge pull request #35 from CoffeeShopTeam/Etai/static-ui/cart" This reverts commit 151a7611747e22feacb48653f1f9c7c82dc418ba, reversing changes made to 69441183a0ba16582efe18f52305ec7f1ab41d55. --- src/views/index.js | 13 ------- src/views/layouts/Cart/Cart.html | 13 +++++-- src/views/layouts/Checkout/Checkout.html | 13 +++++-- src/views/layouts/HomePage/HomePage.css | 31 +++------------ src/views/layouts/OurStory/OurStory.css | 31 +-------------- src/views/layouts/OurStory/OurStory.html | 33 +++++----------- .../layouts/PageNotFound/PageNotFound.css | 22 +---------- .../layouts/PageNotFound/PageNotFound.html | 39 +++++++------------ .../layouts/PrivacyPolicy/PrivacyPolicy.css | 32 +-------------- .../layouts/PrivacyPolicy/PrivacyPolicy.html | 33 +++++----------- .../layouts/ProductPage/ProductPage.html | 31 +++++---------- src/views/layouts/ShopPage/ShopPage.html | 30 +++++--------- src/views/layouts/ViewOrder/ViewOrder.html | 30 ++++---------- src/views/partials/Footer/Footer.css | 16 -------- src/views/partials/Header/Header0.css | 36 +++++------------ 15 files changed, 100 insertions(+), 303 deletions(-) diff --git a/src/views/index.js b/src/views/index.js index 324bbe2..e69de29 100644 --- a/src/views/index.js +++ b/src/views/index.js @@ -1,13 +0,0 @@ - -// Smooth scrolling for Back To Top button -document.addEventListener('DOMContentLoaded', function () { - var goUpButton = document.querySelector('.back-to-top'); - goUpButton.addEventListener('click', function (e) { - e.preventDefault(); - var scrollOptions = { - top: 0, - behavior: 'smooth' - }; - window.scrollTo(scrollOptions); - }); -}); diff --git a/src/views/layouts/Cart/Cart.html b/src/views/layouts/Cart/Cart.html index e29855f..70a74db 100644 --- a/src/views/layouts/Cart/Cart.html +++ b/src/views/layouts/Cart/Cart.html @@ -1,3 +1,9 @@ + + @@ -9,17 +15,19 @@ href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" /> + + + - @@ -306,10 +314,9 @@

- Back To Top - @@ -322,10 +330,9 @@
- Back To Top - + @@ -36,8 +34,7 @@

Urusta.

-
Shop
+
Shop
@@ -53,7 +50,7 @@

Our Story

alt text + class="header0__icon1" onclick="alert(`It is clickable`)" />
@@ -142,21 +139,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -167,10 +155,9 @@
- Back To Top - + @@ -36,8 +34,7 @@

Urusta.

-
- Shop
+
Shop
@@ -53,7 +50,7 @@

Our Story

alt text + class="header0__icon1" onclick="alert(`It is clickable`)" />
@@ -68,10 +65,10 @@

Our Story
-

Oh No!

+

OH No!

- Page not found!
- Go back to home page and start again

+ This page not found!
+ go back to home and start again




HOMEPAGE

@@ -100,21 +97,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -125,10 +113,9 @@
- Back To Top - + @@ -36,8 +34,7 @@

Urusta.

-
- Shop
+
Shop
@@ -53,7 +50,7 @@

Our Story

alt text + class="header0__icon1" onclick="alert(`It is clickable`)" />
@@ -122,21 +119,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -147,10 +135,9 @@
- Back To Top - + @@ -37,8 +35,7 @@

Urusta.

-
- Shop
+
Shop
@@ -296,21 +293,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -322,10 +310,9 @@
- Back To Top - + @@ -37,8 +35,7 @@

Urusta.

-
- Shop
+
Shop
@@ -242,21 +239,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -267,9 +255,9 @@
- Back To Top @@ -36,8 +33,7 @@

Urusta.

-
- Shop
+
Shop
@@ -215,21 +211,12 @@
-
-
- -
-
- A clickable arrow to submit email - -
+ alt text +
Give an email, get the newsletter.
-

@@ -240,10 +227,9 @@
- Back To Top - + + - - - - - - - - - - -
-
- -
-
-

Shopping Cart

-
-
-
-
-
-
- alt text + + +
+
+ +
+
+

Shopping Cart

+
+
+
+
+
+
+ alt text +
+
+
+

CitiZ

+
Red
+
$ 350
+
-
-

CitiZ

-
Red
-
$ 350
+
+
+
-
+
+
1
+
+
+
+
-
-
-
-
-
-
-
-
1
-
-
+
+
+
+ alt text
-
-
- alt text -
-
-
-
-
-
- alt text +
+
+
+
+ alt text +
+
+
+

BARISTA Cups

+
Grey / Large
+
$ 20
+
-
-

BARISTA Cups

-
Grey / Large
-
$ 20
+
+
+
-
+
+
1
+
+
+
+
-
-
-
-
-
-
-
-
1
-
-
+
+
+
+ alt text
-
-
- alt text -
-
-
-
-
-
- alt text +
+
+
+
+ alt text +
+
+
+

ORIGIN Cups

+
White / Medium
+
$ 10
+
-
-
-

ORIGIN Cups

-
White / Medium
-
$ 10
+
+
+
+
-
+
+
1
+
+
+
+
-
-
-
-
-
-
-
-
1
-
-
+
+
+
+ alt text
-
-
- alt text +
+
+

UPDATE CART

-
-
-
-

UPDATE CART

-
-
-
-
- +
+
+
Coupon Code
+
+
+
+
+

APPLY COUPON

-
-
-
-

APPLY COUPON

-
-
-
-
-
-
-

Cart totals

-
-
-
-
- SUBTOTAL

 -
-
-
$380
+
+
+
+
+

Cart totals

+
+
+
+
+ SUBTOTAL

 +
+
+
$380
+
-
-
-
-
- SHIPPING -
-
-
-
- Shipping costs will be calculated once you have - provided address.
-
+
+
+
+ SHIPPING +  
 +
+
+
+ Shipping costs will be calculated once you have + provided address.
+
+
-
-
-
-
- CALCULATE SHIPPING -
-
SELECT A COUNTRY
-
-
-
CITY
-
-
- alt text +
+
+
+ CALCULATE SHIPPING +
+
SELECT A COUNTRY
+
+
+
CITY
+
+
+ alt text +
+
+
+
POST CODE / ZIP
+
+
+

UPDATE TOTALS

-
-
POST CODE / ZIP
-
-
-

UPDATE TOTALS

+
+
+
TOTAL
+
+
$380
-
-
-
TOTAL
-
-
$380
+
+

+ PROCEED TO CHECKOUT +

-
-

- PROCEED TO CHECKOUT -

-
-
-
- -
-
- -
-
-
-
-
-
-
CONTACT
-
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
-
-
- +
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
-
- A clickable arrow to submit email - +
+ © 2023 MadMach. Terms of use and privacy policy. +
+
+
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
-

-
+ alt text
-
- alt text -
-
-
-
- - + + + + + + diff --git a/src/views/layouts/Checkout/Checkout.css b/src/views/layouts/Checkout/Checkout.css index fef6d63..a92632d 100644 --- a/src/views/layouts/Checkout/Checkout.css +++ b/src/views/layouts/Checkout/Checkout.css @@ -6,13 +6,11 @@ position: relative; overflow: hidden; } - -.checkout .main>.cell { +.checkout .main > .cell { display: flex; flex-direction: column; position: relative; } - .checkout .section1__section1 { display: flex; flex-direction: column; @@ -20,7 +18,6 @@ flex-grow: 1; min-height: 1720px; } - .checkout .section1__flexCol { display: flex; flex-direction: column; @@ -29,7 +26,6 @@ flex-grow: 1; margin: 180px 3.71% 254px 8.33%; } - .checkout .section1__title { display: flex; justify-content: center; @@ -41,27 +37,23 @@ position: relative; margin: 0px auto; } - .checkout .section1__flexRow { display: flex; align-items: center; position: relative; margin: 69px 0px 0px; } - .checkout .section1__flexCol1 { display: flex; flex-direction: column; position: relative; flex: 0 1 756px; } - .checkout .section1__flexCol2 { display: flex; flex-direction: column; position: relative; } - .checkout .section1__flexCol3 { display: flex; flex-direction: column; @@ -69,39 +61,33 @@ position: relative; margin: 0px 39.15% 0px 0%; } - .checkout .section1__highlights1_box { position: relative; margin: 15px 0px 0px; } - .checkout .section1__highlights1 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; } - .checkout .section1__highlights1_span0 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .checkout .section1__highlights1_span1 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .checkout .section1__rect4 { display: flex; flex-direction: column; position: relative; margin: 23px 0px 0px; } - .checkout .section1__rect41 { outline: 1px solid rgb(216, 216, 216); outline-offset: -1px; @@ -110,14 +96,12 @@ min-height: 187px; margin: 0px 12px 0px 0px; } - -.checkout .section1__flexCol2>.cell { +.checkout .section1__flexCol2 > .cell { margin-top: -162px; display: flex; flex-direction: column; position: relative; } - .checkout .section1__flexCol4 { display: flex; flex-direction: column; @@ -126,21 +110,18 @@ flex-grow: 1; margin: 0px 5.69% 0px 4.1%; } - .checkout .section1__highlights { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); letter-spacing: 0px; position: relative; } - .checkout .section1__flexRow1 { display: flex; align-items: center; position: relative; margin: 39px 0px 0px; } - .checkout .section1__flexCol5 { display: flex; flex-direction: column; @@ -148,25 +129,21 @@ flex: 0 1 431px; margin: 13px 0px 0px; } - .checkout .section1__desc { font: 400 12px/1.66 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); letter-spacing: 0px; position: relative; } - .checkout .section1__line4 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 22px 0px 0px; } - -.checkout .section1__flexRow1>.spacer { +.checkout .section1__flexRow1 > .spacer { flex: 0 1 35px; } - .checkout .section1__content_box { display: flex; flex-direction: column; @@ -178,7 +155,6 @@ flex: 0 1 216px; margin: 0px 0px 1px; } - .checkout .section1__highlights4 { display: flex; justify-content: center; @@ -190,59 +166,50 @@ flex-grow: 1; margin: 16px 40px 16px 39px; } - .checkout .section1__flexCol6 { display: flex; flex-direction: column; position: relative; margin: 80px 5px 0px 0px; } - .checkout .section1__medium_title { font: 400 26px/1.34 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - .checkout .section1__flexCol7 { display: flex; flex-direction: column; position: relative; margin: 28px 0px 0px; } - .checkout .section1__flexRow2 { display: flex; align-items: center; position: relative; } - .checkout .section1__flexCol8 { display: flex; flex-direction: column; position: relative; flex: 0 1 346px; } - .checkout .section1__line { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 12px 0px 0px; } - -.checkout .section1__flexRow2>.spacer { +.checkout .section1__flexRow2 > .spacer { flex: 0 1 58px; } - .checkout .section1__flexCol9 { display: flex; flex-direction: column; position: relative; flex: 0 1 347px; } - .checkout .section1__highlights2 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -250,28 +217,24 @@ position: relative; margin: 0px 1px; } - .checkout .section1__line1 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 12px 0px 0px; } - .checkout .section1__flexCol10 { display: flex; flex-direction: column; position: relative; margin: 38px 7px 0px 0px; } - .checkout .section1__line2 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 12px 0px 0px; } - .checkout .section1__highlights3 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -280,18 +243,15 @@ flex: 0 0 auto; min-width: 94px; } - -.checkout .section1__flexRow2>.spacer1 { +.checkout .section1__flexRow2 > .spacer1 { flex: 0 1 636px; } - -.checkout .section1__flexRow2>.cell { +.checkout .section1__flexRow2 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 14px; } - .checkout .section1__image { width: 14px; height: auto; @@ -303,7 +263,6 @@ min-width: 14px; margin: 12px 0px 9px; } - .checkout .section1__flexCol11 { display: flex; flex-direction: column; @@ -311,14 +270,12 @@ position: relative; margin: 37px 61.12% 0px 0%; } - .checkout .section1__flexRow3 { display: flex; align-items: center; column-gap: 10px; position: relative; } - .checkout .section1__rect1 { border-radius: 2px 2px 2px 2px; outline: 1px solid rgb(112, 112, 112); @@ -328,7 +285,6 @@ min-height: 17px; margin: 5px 0px 6px; } - .checkout .section1__highlights11 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -337,7 +293,6 @@ flex: 0 0 auto; min-width: 187px; } - .checkout .section1__flexRow4 { display: flex; align-items: center; @@ -345,7 +300,6 @@ position: relative; margin: 19px 0px 0px; } - .checkout .section1__rect { border-radius: 2px 2px 2px 2px; outline: 1px solid rgb(112, 112, 112); @@ -355,7 +309,6 @@ min-height: 16px; margin: 5px 0px 6px; } - .checkout .section1__highlights12 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -364,25 +317,21 @@ flex: 0 0 auto; min-width: 261px; } - .checkout .section1__flexCol12 { display: flex; flex-direction: column; position: relative; margin: 39px 7px 0px 0px; } - .checkout .section1__line21 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 11px 0px 0px; } - -.checkout .section1__flexRow>.spacer { +.checkout .section1__flexRow > .spacer { flex: 1 1 188.8px; } - .checkout .section1__flexCol13 { display: flex; flex-direction: column; @@ -390,14 +339,12 @@ flex: 0 1 744px; margin: 95.67px 0px 137.33px; } - .checkout .section1__medium_title1 { font: 400 26px/0.96 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - .checkout .section1__content_box2 { display: flex; flex-direction: column; @@ -405,7 +352,6 @@ position: relative; margin: 40px 0px 0px; } - .checkout .section1__flexCol14 { display: flex; flex-direction: column; @@ -414,14 +360,12 @@ flex-grow: 1; margin: 40px auto 50px; } - .checkout .section1__flexRow5 { display: flex; align-items: center; position: relative; margin: 0px 0px 0px 3px; } - .checkout .section1__highlights13 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -430,11 +374,9 @@ flex: 0 0 auto; min-width: 95px; } - -.checkout .section1__flexRow5>.spacer { +.checkout .section1__flexRow5 > .spacer { flex: 0 1 454px; } - .checkout .section1__highlights14 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -444,21 +386,18 @@ min-width: 48px; margin: 0px 0px 1px; } - .checkout .section1__line3 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 18px 5px 0px 3px; } - .checkout .section1__flexRow6 { display: flex; align-items: center; position: relative; margin: 30px 1px 0px 2px; } - .checkout .section1__highlights21 { font: 400 16px/1.62 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -468,11 +407,9 @@ min-width: 44px; margin: 1px 0px 0px; } - -.checkout .section1__flexRow6>.spacer { +.checkout .section1__flexRow6 > .spacer { flex: 0 1 512px; } - .checkout .section1__highlights5 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -481,14 +418,12 @@ flex: 0 0 auto; min-width: 41px; } - .checkout .section1__flexRow7 { display: flex; align-items: center; position: relative; margin: 21px 0px 0px; } - .checkout .section1__highlights22 { font: 400 16px/1.62 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -497,11 +432,9 @@ flex: 0 0 auto; min-width: 134px; } - -.checkout .section1__flexRow7>.spacer { +.checkout .section1__flexRow7 > .spacer { flex: 0 1 433px; } - .checkout .section1__highlights6 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -510,14 +443,12 @@ flex: 0 0 auto; min-width: 30px; } - .checkout .section1__flexRow8 { display: flex; align-items: center; position: relative; margin: 26px 3px 0px; } - .checkout .section1__highlights23 { font: 400 16px/1.62 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -526,11 +457,9 @@ flex: 0 0 auto; min-width: 123px; } - -.checkout .section1__flexRow8>.spacer { +.checkout .section1__flexRow8 > .spacer { flex: 0 1 444px; } - .checkout .section1__highlights7 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -539,21 +468,18 @@ flex: 0 0 auto; min-width: 26px; } - .checkout .section1__line31 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 13px 5px 0px 3px; } - .checkout .section1__flexRow9 { display: flex; align-items: center; position: relative; margin: 16px 3px 0px; } - .checkout .section1__highlights15 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -562,18 +488,15 @@ flex: 0 0 auto; min-width: 99px; } - -.checkout .section1__flexRow9>.spacer { +.checkout .section1__flexRow9 > .spacer { flex: 0 1 454px; } - .checkout .section1__line32 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 10px 5px 0px 3px; } - .checkout .section1__highlights16 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -582,11 +505,9 @@ flex: 0 0 auto; min-width: 90px; } - -.checkout .section1__flexRow9>.spacer1 { +.checkout .section1__flexRow9 > .spacer1 { flex: 0 1 403px; } - .checkout .section1__highlights8 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -595,21 +516,18 @@ flex: 0 0 auto; min-width: 100px; } - .checkout .section1__line33 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 14px 4px 0px; } - .checkout .section1__flexRow10 { display: flex; align-items: center; position: relative; margin: 20px 3px 0px; } - .checkout .section1__highlights31 { font: 700 16px/1.31 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -618,11 +536,9 @@ flex: 0 0 auto; min-width: 64px; } - -.checkout .section1__flexRow10>.spacer { +.checkout .section1__flexRow10 > .spacer { flex: 0 1 485px; } - .checkout .section1__highlights32 { font: 700 16px/1.31 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -631,21 +547,18 @@ flex: 0 0 auto; min-width: 43px; } - .checkout .section1__flexCol15 { display: flex; flex-direction: column; position: relative; margin: 63px 5px 0px 3px; } - -.checkout .section1__flexRow3>.cell { +.checkout .section1__flexRow3 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 21px; } - .checkout .section1__image1 { width: 21px; height: auto; @@ -657,7 +570,6 @@ min-width: 21px; margin: 7px 0px 5px; } - .checkout .section1__highlights17 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -666,7 +578,6 @@ flex: 0 0 auto; min-width: 188px; } - .checkout .section1__desc1 { font: 400 12px/1.66 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -674,7 +585,6 @@ position: relative; margin: 20px 0px 0px; } - .checkout .section1__flexRow11 { display: flex; align-items: center; @@ -682,14 +592,12 @@ position: relative; margin: 21px 0px 0px; } - -.checkout .section1__flexRow11>.cell { +.checkout .section1__flexRow11 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 21px; } - .checkout .section1__highlights18 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -698,14 +606,12 @@ flex: 0 0 auto; min-width: 161px; } - -.checkout .section1__flexRow4>.cell { +.checkout .section1__flexRow4 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 21px; } - .checkout .section1__image2 { width: 21px; height: auto; @@ -717,7 +623,6 @@ min-width: 21px; margin: 6px 0px 5px; } - .checkout .section1__highlights19 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -726,7 +631,6 @@ flex: 0 0 auto; min-width: 158px; } - .checkout .section1__flexRow12 { display: flex; align-items: center; @@ -734,14 +638,12 @@ position: relative; margin: 18px 0px 0px; } - -.checkout .section1__flexRow12>.cell { +.checkout .section1__flexRow12 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 21px; } - .checkout .section1__highlights110 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -750,14 +652,12 @@ flex: 0 0 auto; min-width: 61px; } - -.checkout .section1__flexRow12>.cell1 { +.checkout .section1__flexRow12 > .cell1 { display: flex; flex-direction: column; position: relative; flex: 0 1 16px; } - .checkout .section1__icon { width: 16px; height: auto; @@ -769,7 +669,6 @@ min-width: 16px; margin: 8px 0px 4px; } - .checkout .section1__content_box1 { display: flex; flex-direction: column; @@ -780,7 +679,6 @@ position: relative; margin: 47px 5px 0px 3px; } - .checkout .section1__highlights41 { display: flex; justify-content: center; @@ -794,7 +692,6 @@ min-width: 121px; margin: 15px auto 16px; } - .checkout .section2 { position: relative; -} \ No newline at end of file +} diff --git a/src/views/layouts/Checkout/Checkout.html b/src/views/layouts/Checkout/Checkout.html index 97f0e20..573f3b4 100644 --- a/src/views/layouts/Checkout/Checkout.html +++ b/src/views/layouts/Checkout/Checkout.html @@ -1,344 +1,393 @@ - - + + + - - - + + + - - - - - - - + + + + + + - - - - - - - - - + + + - - - -
-
- -
-
-

Checkout

-
-
-
-
-
- Returning customer? - Click here to login -
-
- Have a coupon? - Click here to enter your code -
-
-
-
-
-
-
-
- If you have a coupon code, please apply it below. + + +
+
+ +
+
+

Checkout

+
+
+
+
+
+ Returning customer? Click here to login
-
-
-
Coupon Code
-
-
-
-
-

APPLY COUPON

+
+ Have a coupon? Click here to enter your code +
+
+
+
+
+
+
+
+ If you have a coupon code, please apply it below. +
+
+
+
Coupon Code
+
+
+
+
+

APPLY COUPON

+
-
-
-

Billing Details

-
-
-
-
First name *
-
+
+

Billing Details

+
+
+
+
First name *
+
+
+
+
+
Last name *
+
+
-
-
-
Last name *
-
+
+
Company Name
+
-
-
-
Company Name
-
-
-
-
-
Country *
-
-
- alt text +
+
+
Country *
+
+
+ alt text +
+
-
-
-
-
Street Address *
-
-
-
-
Postcode / ZIP *
-
-
-
-
Town / City *
-
-
-
-
Phone *
-
-
-
-
Email *
-
-
-
-
-
-
- Create an acoount? -
+
+
Street Address *
+
-
-
-
- Ship to a different address? -
+
+
Postcode / ZIP *
+
+
+
+
Town / City *
+
+
+
+
Phone *
+
+
+
+
Email *
+
+
+
+
+
+
+ Create an acoount? +
+
+
+
+
+ Ship to a different address? +
+
+
+
+
Order notes
+
-
-
-
Order notes
-
-
-
-
-

YOUR ORDER

-
-
-
-
PRODUCT
-
-
TOTAL
-
-
-
-
CitiZ
-
-
$350
-
-
-
BARISTA Cups
-
-
$20
-
-
-
ORIGIN Cups
-
-
$10
-
-
-
-
SUBTOTAL
-
-
$380
-
-
-
-
SHIPPING
-
-
Free shipping
-
-
-
-
TOTAL
-
-
$380
-
-
-
-
- alt text -
-
- Direct bank transfer -
+
+
+

YOUR ORDER

+
+
+
+
PRODUCT
+
+
TOTAL
-

- Make your payment directly into our bank account. Please - use your Order ID as the payment reference. Your order - will not be shipped until the funds have cleared in our - account -

-
-
- alt text -
-
Check payments
+
+
+
CitiZ
+
+
$350
-
-
- alt text -
-
Cash on delivery
+
+
BARISTA Cups
+
+
$20
+
+
+
ORIGIN Cups
+
+
$10
+
+
+
+
SUBTOTAL
+
+
$380
+
+
+
+
SHIPPING
+
+
Free shipping
+
+
+
+
TOTAL
+
+
$380
-
-
- alt text +
+
+
+ alt text +
+
+ Direct bank transfer +
+
+

+ Make your payment directly into our bank account. Please + use your Order ID as the payment reference. Your order + will not be shipped until the funds have cleared in our + account +

+
+
+ alt text +
+
Check payments
+
+
+
+ alt text +
+
Cash on delivery
-
PayPal
-
- alt text +
+
+ alt text +
+
PayPal
+
+ alt text +
-
-
-

PLACE ORDER

+
+

PLACE ORDER

+
-
-
- -
-
- -
-
-
-
-
-
-
CONTACT
-
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
-
-
- +
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
-
- A clickable arrow to submit email - +
+ © 2023 MadMach. Terms of use and privacy policy. +
+
+
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
-

-
+ alt text
-
- alt text -
-
-
-
- - + + + + + + diff --git a/src/views/layouts/HomePage/HomePage.html b/src/views/layouts/HomePage/HomePage.html index 6b66343..5d9c5a9 100644 --- a/src/views/layouts/HomePage/HomePage.html +++ b/src/views/layouts/HomePage/HomePage.html @@ -1,146 +1,194 @@ + + + - - - + + + - - + + + + + + - + + + - - - - - - - - - - - - - -
-
- -
-
-
-
-
-
-
-
- alt text + +
+
+ +
+
+
+
+
+
+ alt text +
-
-
-
- alt text -
-
-

Caffeinated Journey

-

- Explore our world of exquisite coffee.
Elevate your - experience with captivating flavors and premium - products.
Join us on this caffeinated journey.

Welcome - to the ultimate coffee destination. -

-
-
-
-

Shop Now

+
+
+ alt text +
+
+

Caffeinated Journey

+

+ Explore our world of exquisite coffee.
Elevate your + experience with captivating flavors and premium + products.
Join us on this caffeinated journey.

Welcome + to the ultimate coffee destination. +

+
+
+
+

Shop Now

+
+
+ +
+
+
+

Urusta.

+
+

Shop

+
+

Our Story

+
+
+
+
+ alt text
-
- -
-
-
-

Urusta.

-
-

Shop

-
-

Our Story

-
-
-
-
- alt text -
-
-
- alt text -
-
-
- alt text -
-
-
-
+
+
+ alt text +
+
+
+ alt text
-
- +
-
- -
-
-
-
-
-
-
CONTACT
+
+
+
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
-
-
-
- - - - \ No newline at end of file + + + + + + diff --git a/src/views/layouts/OurStory/OurStory.html b/src/views/layouts/OurStory/OurStory.html index e7146ab..fcb31cf 100644 --- a/src/views/layouts/OurStory/OurStory.html +++ b/src/views/layouts/OurStory/OurStory.html @@ -1,169 +1,211 @@ + + + - - - + + + - - - + + + + + + - - - - - - + + + - - - - - - -
-
- -
-
-

About Us

-
-
- Welcome to Urusta, your ultimate destination for all things - coffee! We are a passionate team of coffee enthusiasts dedicated - to bringing you the finest selection of coffee machines and a - wide range of other coffee-related products. Whether you're - a casual coffee lover or a seasoned connoisseur, we have - everything you need to enhance your coffee experience. -
-
-

Quality

-
- We pride ourselves on providing exceptional customer service - and ensuring your complete satisfaction. Our knowledgeable - team is always ready to assist you in finding the perfect - coffee machine or product that matches your needs and - preferences. We understand that choosing the right equipment - can be overwhelming, so we are here to guide you through the - selection process, answer your questions, and provide - personalized recommendations. + + +
+
+ +
+
+

About Us

+
+
+ Welcome to Urusta, your ultimate destination for all things + coffee! We are a passionate team of coffee enthusiasts dedicated + to bringing you the finest selection of coffee machines and a + wide range of other coffee-related products. Whether you're + a casual coffee lover or a seasoned connoisseur, we have + everything you need to enhance your coffee experience.
-
-
-

Discover

-
- We pride ourselves on providing exceptional customer service - and ensuring your complete satisfaction. Our knowledgeable - team is always ready to assist you in finding the perfect - coffee machine or product that matches your needs and - preferences. We understand that choosing the right equipment - can be overwhelming, so we are here to guide you through the - selection process, answer your questions, and provide - personalized recommendations. +
+

Quality

+
+ We pride ourselves on providing exceptional customer service + and ensuring your complete satisfaction. Our knowledgeable + team is always ready to assist you in finding the perfect + coffee machine or product that matches your needs and + preferences. We understand that choosing the right equipment + can be overwhelming, so we are here to guide you through the + selection process, answer your questions, and provide + personalized recommendations. +
+
+
+

Discover

+
+ We pride ourselves on providing exceptional customer service + and ensuring your complete satisfaction. Our knowledgeable + team is always ready to assist you in finding the perfect + coffee machine or product that matches your needs and + preferences. We understand that choosing the right equipment + can be overwhelming, so we are here to guide you through the + selection process, answer your questions, and provide + personalized recommendations. +
+
+
+ Thank you for choosing Urusta as your trusted destination for + all your coffee needs. We look forward to serving you and being + a part of your coffee journey. Get ready to awaken your senses + and savor the rich flavors and aromas of the perfect cup of + coffee. Cheers!
-
- Thank you for choosing Urusta as your trusted destination for - all your coffee needs. We look forward to serving you and being - a part of your coffee journey. Get ready to awaken your senses - and savor the rich flavors and aromas of the perfect cup of - coffee. Cheers!
-
-
-
- -
-
- -
-
-
-
-
-
-
CONTACT
+
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
- - -
- - + + + + + + diff --git a/src/views/layouts/PageNotFound/PageNotFound.html b/src/views/layouts/PageNotFound/PageNotFound.html index 0263bb2..a152478 100644 --- a/src/views/layouts/PageNotFound/PageNotFound.html +++ b/src/views/layouts/PageNotFound/PageNotFound.html @@ -1,127 +1,169 @@ + + + - - - + + + - - - + + + + + + - - - - - - + + + - - - - - - -
-
-

OH No!

-

- This page not found!
- go back to home and start again




-

-
-

HOMEPAGE

-
-
-
- -
-
-
-
-
-
-
CONTACT
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
-
+ +
- - - + + + diff --git a/src/views/layouts/PrivacyPolicy/PrivacyPolicy.html b/src/views/layouts/PrivacyPolicy/PrivacyPolicy.html index 8a4377f..8789bbf 100644 --- a/src/views/layouts/PrivacyPolicy/PrivacyPolicy.html +++ b/src/views/layouts/PrivacyPolicy/PrivacyPolicy.html @@ -1,149 +1,191 @@ + + + - - - + + + - - - + + + + + + - - - - - - + + + - - - - - - -
-
-

Privacy Policy

-
-
- This Privacy Policy describes how Urusta collect, use, and disclose - information about you. This Privacy Policy applies to information - that we collect when you use or access our websites, mobile - applications, and services that display or link to this Privacy - Policy, or when you otherwise interact with us.
-
-
-

Security

-
- We use standard security measures. While we make every effort to - help ensure the integrity and security of our network and systems, - the Internet is not 100% secure. We cannot promise that your use - of our sites and apps will be completely safe. We encourage you to - use caution, and not to share or reuse passwords. -
-
-
-

We Combine Imformation

-
- We may combine the information we receive from and about you, - including information you provide to us and information we - automatically collect through our Services, as well as information - collected offline, across other computers or devices that you may - use, and from third party sources. + + +
+
+

Privacy Policy

+
+
+ This Privacy Policy describes how Urusta collect, use, and disclose + information about you. This Privacy Policy applies to information + that we collect when you use or access our websites, mobile + applications, and services that display or link to this Privacy + Policy, or when you otherwise interact with us.
+
+

Security

+
+ We use standard security measures. While we make every effort to + help ensure the integrity and security of our network and systems, + the Internet is not 100% secure. We cannot promise that your use + of our sites and apps will be completely safe. We encourage you to + use caution, and not to share or reuse passwords. +
+
+
+

We Combine Imformation

+
+ We may combine the information we receive from and about you, + including information you provide to us and information we + automatically collect through our Services, as well as information + collected offline, across other computers or devices that you may + use, and from third party sources. +
+
-
-
- -
-
-
-
-
-
-
CONTACT
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
-
+ +
-
- - + + + diff --git a/src/views/layouts/ProductPage/ProductPage.css b/src/views/layouts/ProductPage/ProductPage.css index ddef55b..bb57762 100644 --- a/src/views/layouts/ProductPage/ProductPage.css +++ b/src/views/layouts/ProductPage/ProductPage.css @@ -7,7 +7,6 @@ overflow: hidden; min-height: 2317px; } - .product-page .line2 { background-color: rgb(216, 216, 216); width: 1249px; @@ -16,27 +15,23 @@ top: 1px; left: -1px; } - .product-page .flexCol { display: flex; flex-direction: column; position: relative; flex-grow: 1; } - -.product-page .flexCol>.cell { +.product-page .flexCol > .cell { display: flex; flex-direction: column; position: relative; } - .product-page .section1__section1 { display: flex; flex-direction: column; position: relative; flex-grow: 1; } - .product-page .section1__flexCol { display: flex; flex-direction: column; @@ -45,14 +40,12 @@ flex-grow: 1; margin: 250px auto 199px; } - .product-page .section1__group { display: flex; flex-direction: column; position: relative; margin: 0px 11px; } - .product-page .section1__line1 { background-color: rgb(216, 216, 216); height: 2px; @@ -61,34 +54,29 @@ left: 200px; right: 699px; } - .product-page .section1__flexRow { display: flex; align-items: center; position: relative; flex-grow: 1; } - .product-page .section1__flexRow1 { display: flex; align-items: center; position: relative; flex: 0 1 880px; } - .product-page .section1__flexCol1 { display: flex; flex-direction: column; position: relative; flex: 0 1 133px; } - -.product-page .section1__flexCol1>.cell { +.product-page .section1__flexCol1 > .cell { display: flex; flex-direction: column; position: relative; } - .product-page .section1__image3 { width: calc(100% - 0px); height: auto; @@ -98,7 +86,6 @@ object-position: center center; position: relative; } - .product-page .section1__image31 { width: calc(100% - 0px); height: auto; @@ -109,18 +96,15 @@ position: relative; margin: 40px 0px 0px; } - -.product-page .section1__flexRow1>.spacer { +.product-page .section1__flexRow1 > .spacer { flex: 0 1 68px; } - -.product-page .section1__flexRow1>.cell { +.product-page .section1__flexRow1 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 679px; } - .product-page .section1__image4 { width: calc(100% - 0px); height: auto; @@ -131,11 +115,9 @@ position: relative; margin: 0px 0px 24px; } - -.product-page .section1__flexRow>.spacer { +.product-page .section1__flexRow > .spacer { flex: 1 1 77px; } - .product-page .section1__flexCol2 { display: flex; flex-direction: column; @@ -143,7 +125,6 @@ flex: 0 1 611px; margin: 0px 0px 18px; } - .product-page .section1__flexCol3 { display: flex; flex-direction: column; @@ -151,7 +132,6 @@ position: relative; margin: 0px 68.74% 0px 0.33%; } - .product-page .section1__medium_title { font: 400 26px/1 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -159,7 +139,6 @@ min-width: 190px; position: relative; } - .product-page .section1__subtitle { font: 500 22px/1.18 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -167,21 +146,18 @@ position: relative; margin: 26px 0px 0px; } - .product-page .section1__flexRow2 { display: flex; align-items: center; position: relative; margin: 23px 4px 0px; } - -.product-page .section1__flexRow2>.cell { +.product-page .section1__flexRow2 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 22px; } - .product-page .section1__image { width: 22px; height: auto; @@ -193,18 +169,15 @@ min-width: 22px; margin: 1px 0px 10px; } - -.product-page .section1__flexRow2>.spacer { +.product-page .section1__flexRow2 > .spacer { flex: 0 1 13px; } - -.product-page .section1__flexRow2>.cell1 { +.product-page .section1__flexRow2 > .cell1 { display: flex; flex-direction: column; position: relative; flex: 0 1 23px; } - .product-page .section1__image1 { width: 23px; height: auto; @@ -216,15 +189,12 @@ min-width: 23px; margin: 1px 0px 10px; } - -.product-page .section1__flexRow2>.spacer1 { +.product-page .section1__flexRow2 > .spacer1 { flex: 0 1 12px; } - -.product-page .section1__flexRow2>.spacer2 { +.product-page .section1__flexRow2 > .spacer2 { flex: 0 1 29px; } - .product-page .section1__highlights { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -233,7 +203,6 @@ flex: 0 0 auto; min-width: 192px; } - .product-page .section1__highlights1 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -242,14 +211,12 @@ min-height: 238px; margin: 5px 2px 0px 0px; } - .product-page .section1__flexCol4 { display: flex; flex-direction: column; position: relative; margin: 17px 0px 0px 2px; } - .product-page .section1__box { display: flex; flex-direction: column; @@ -262,7 +229,6 @@ position: relative; margin: 0px 0% 0px 25.94%; } - .product-page .section1__highlights2 { display: flex; justify-content: center; @@ -276,7 +242,6 @@ min-width: 130px; margin: 14px auto; } - .product-page .section1__content_box { display: flex; flex-direction: column; @@ -288,7 +253,6 @@ bottom: -2px; left: -158px; } - .product-page .section1__flexRow3 { display: flex; align-items: center; @@ -297,7 +261,6 @@ height: 2px; margin: 14px 18px 12px 21px; } - .product-page .section1__highlights3 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -306,11 +269,9 @@ flex: 0 0 auto; min-width: 11px; } - -.product-page .section1__flexRow3>.spacer { +.product-page .section1__flexRow3 > .spacer { flex: 0 1 30px; } - .product-page .section1__highlights4 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -319,11 +280,9 @@ flex: 0 0 auto; min-width: 6px; } - -.product-page .section1__flexRow3>.spacer1 { +.product-page .section1__flexRow3 > .spacer1 { flex: 0 1 31px; } - .product-page .section1__highlights5 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -332,21 +291,18 @@ flex: 0 0 auto; min-width: 12px; } - .product-page .section1__flexRow4 { display: flex; align-items: center; position: relative; margin: 30px 0px 0px; } - -.product-page .section1__flexRow4>.cell { +.product-page .section1__flexRow4 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 23px; } - .product-page .section1__icon { width: 23px; height: auto; @@ -358,11 +314,9 @@ min-width: 23px; margin: 2px 0px 4px; } - -.product-page .section1__flexRow4>.spacer { +.product-page .section1__flexRow4 > .spacer { flex: 0 1 18px; } - .product-page .section1__rect1 { background-color: rgb(216, 216, 216); position: relative; @@ -370,18 +324,15 @@ min-width: 1px; min-height: 29px; } - -.product-page .section1__flexRow4>.spacer1 { +.product-page .section1__flexRow4 > .spacer1 { flex: 0 1 25px; } - -.product-page .section1__flexRow4>.cell1 { +.product-page .section1__flexRow4 > .cell1 { display: flex; flex-direction: column; position: relative; flex: 0 1 171px; } - .product-page .section1__image7 { width: calc(100% - 0px); height: auto; @@ -392,7 +343,6 @@ position: relative; margin: 3px 0px; } - .product-page .section1__flexRow5 { display: flex; align-items: center; @@ -400,7 +350,6 @@ position: relative; margin: 53px 0px 0px; } - .product-page .section1__highlights11 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -409,7 +358,6 @@ flex: 0 0 auto; min-width: 107px; } - .product-page .section1__highlights6 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -418,28 +366,24 @@ flex: 0 0 auto; min-width: 185px; } - .product-page .section1__flexCol5 { display: flex; flex-direction: column; position: relative; margin: 123px 20px 0px 0px; } - .product-page .section1__flexCol6 { display: flex; flex-direction: column; position: relative; margin: 0px 1px 0px 0px; } - .product-page .section1__flexRow6 { display: flex; align-items: center; position: relative; margin: 0px 10px; } - @media (max-width: 1919px) { .product-page .section1__flexRow6 { justify-content: flex-start; @@ -447,15 +391,13 @@ column-gap: 0px; } } - -.product-page .section1__flexRow6>.cell { +.product-page .section1__flexRow6 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 0 135px; min-width: 135px; } - .product-page .section1__subtitle1 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -465,26 +407,22 @@ position: relative; flex-grow: 1; } - -.product-page .section1__flexRow6>.spacer { +.product-page .section1__flexRow6 > .spacer { flex: 0 1 133px; } - -.product-page .section1__flexRow6>.cell1 { +.product-page .section1__flexRow6 > .cell1 { display: flex; flex-direction: column; position: relative; flex: 0 0 205px; min-width: 205px; } - .product-page .section1__group1 { display: flex; flex-direction: column; position: relative; flex-grow: 1; } - .product-page .section1__line3 { background-color: rgb(0, 0, 0); height: 1px; @@ -493,7 +431,6 @@ left: 0px; right: 0px; } - .product-page .section1__subtitle2 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -501,26 +438,22 @@ position: relative; flex-grow: 1; } - -.product-page .section1__flexRow6>.spacer1 { +.product-page .section1__flexRow6 > .spacer1 { flex: 0 1 122px; } - @media (max-width: 1919px) { - .product-page .section1__flexRow6>.spacer1 { + .product-page .section1__flexRow6 > .spacer1 { min-width: unset; display: flex; } } - -.product-page .section1__flexRow6>.cell2 { +.product-page .section1__flexRow6 > .cell2 { display: flex; flex-direction: column; position: relative; flex: 0 0 116px; min-width: 116px; } - .product-page .section1__content_box1 { display: flex; flex-direction: column; @@ -528,82 +461,70 @@ position: relative; margin: 17px 0px 0px; } - .product-page .section1__highlights12_box { position: relative; min-height: 175px; margin: 55px 0px 0px 10px; } - .product-page .section1__highlights12 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; } - .product-page .section1__highlights12_span0 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span1 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span2 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span3 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span4 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span5 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span6 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .product-page .section1__highlights12_span7 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .product-page .section1__flexCol7 { display: flex; flex-direction: column; position: relative; margin: 57px 0px 0px 10px; } - .product-page .section1__medium_title1 { font: 400 26px/1.34 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -611,27 +532,23 @@ min-width: 190px; position: relative; } - .product-page .section1__flexRow7 { display: flex; align-items: center; position: relative; margin: 19px 0px 0px; } - .product-page .section1__flexCol8 { display: flex; flex-direction: column; position: relative; flex: 0 1 478px; } - -.product-page .section1__flexCol8>.cell { +.product-page .section1__flexCol8 > .cell { display: flex; flex-direction: column; position: relative; } - .product-page .section1__image2 { width: calc(100% - 0px); height: auto; @@ -641,7 +558,6 @@ object-position: center center; position: relative; } - .product-page .section1__subtitle21 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -649,7 +565,6 @@ position: relative; margin: 29px 0px 0px; } - .product-page .section1__subtitle3 { font: 500 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -657,24 +572,20 @@ position: relative; margin: 20px 0px 0px; } - -.product-page .section1__flexRow7>.spacer { +.product-page .section1__flexRow7 > .spacer { flex: 1 1 78px; } - .product-page .section1__flexCol9 { display: flex; flex-direction: column; position: relative; flex: 0 1 479px; } - -.product-page .section1__flexCol9>.cell { +.product-page .section1__flexCol9 > .cell { display: flex; flex-direction: column; position: relative; } - .product-page .section1__image5 { width: calc(100% - 0px); height: auto; @@ -684,20 +595,17 @@ object-position: center center; position: relative; } - .product-page .section1__subtitle22 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - -.product-page .section1__flexCol8>.cell1 { +.product-page .section1__flexCol8 > .cell1 { display: flex; flex-direction: column; position: relative; } - .product-page .section1__image6 { width: calc(100% - 0px); height: auto; @@ -707,7 +615,6 @@ object-position: center center; position: relative; } - .product-page .section1__subtitle31 { font: 500 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -715,7 +622,6 @@ position: relative; margin: 21px 0px 0px; } - .product-page .section1__group2 { display: flex; flex-direction: column; @@ -725,7 +631,6 @@ top: 0px; right: 0px; } - .product-page .section1__group3 { display: flex; flex-direction: column; @@ -735,7 +640,6 @@ left: 160px; right: 160px; } - .product-page .section1__content_box2 { display: flex; flex-direction: column; @@ -743,7 +647,6 @@ position: relative; flex-grow: 1; } - .product-page .section1__flexRow8 { display: flex; align-items: center; @@ -751,7 +654,6 @@ flex-grow: 1; margin: 19px 31px 18px 38px; } - .product-page .section1__flexRow9 { display: flex; align-items: center; @@ -759,14 +661,12 @@ flex: 0 0 auto; min-width: 426px; } - -.product-page .section1__flexRow9>.cell { +.product-page .section1__flexRow9 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 26px; } - .product-page .section1__icon1 { width: 26px; height: auto; @@ -778,11 +678,9 @@ min-width: 26px; margin: 0px 0px 1px; } - -.product-page .section1__flexRow9>.spacer { +.product-page .section1__flexRow9 > .spacer { flex: 0 1 32px; } - .product-page .section1__highlights13 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -791,11 +689,9 @@ flex: 0 0 auto; min-width: 368px; } - -.product-page .section1__flexRow8>.spacer { +.product-page .section1__flexRow8 > .spacer { flex: 1 1 994px; } - .product-page .section1__highlights31 { font: 700 16px/1.31 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -806,7 +702,6 @@ min-width: 111px; margin: 4px 0px 2px; } - .product-page .section1__flexCol10 { display: flex; flex-direction: column; @@ -816,20 +711,17 @@ left: 0px; right: 0px; } - .product-page .section1__line6 { background-color: rgb(161, 138, 104); height: 2px; position: relative; } - .product-page .section1__line { background-color: rgb(216, 216, 216); height: 3px; position: relative; margin: 2px 0px 0px; } - .product-page .section2 { position: relative; -} \ No newline at end of file +} diff --git a/src/views/layouts/ProductPage/ProductPage.html b/src/views/layouts/ProductPage/ProductPage.html index d522da5..43178ab 100644 --- a/src/views/layouts/ProductPage/ProductPage.html +++ b/src/views/layouts/ProductPage/ProductPage.html @@ -1,324 +1,430 @@ + + + - - - + + + - - - + + + + + + - - - - - - + + + + - - - - - - - +
+
+
+
+ +
+
+
+
+
+
+
+
+ alt text +
+
+ alt text +
+
+ alt text +
+
+ alt text +
- alt text + alt text
-
-
79 customer review
-
- Sophisticated convenience and versatility Whether you’re - in the mood for a cappuccino, a latte, a flat white, or - even if you just want to add a bit more milk froth to your - coffee, just say the word, and let the Gran Lattissima do - the work.
With its signature Lattissima design and - one-touch system, it’s easy on the eyes, and easy to use. - The machine is also equipped with an easy rinsing system, - so it cleans up between two recipe preparations, while you - lean back.
-
-
-
-

ADD TO CART

-
-
-
-
-
-
1
-
-
+
-
-
+
+
+
+

Gran Lattissima

+

$ 800

-
+
- alt text + alt text
-
+
+ alt text +
+
+
+ alt text +
- alt text + alt text +
+
+
+ alt text +
+
+
79 customer review
+
+
+ Sophisticated convenience and versatility Whether you’re + in the mood for a cappuccino, a latte, a flat white, or + even if you just want to add a bit more milk froth to your + coffee, just say the word, and let the Gran Lattissima do + the work.
With its signature Lattissima design and + one-touch system, it’s easy on the eyes, and easy to use. + The machine is also equipped with an easy rinsing system, + so it cleans up between two recipe preparations, while you + lean back.
+
+
+
+

ADD TO CART

+
+
+
-
+
+
1
+
+
+
+
+
+
+
+
+ alt text +
+
+
+
+
+ alt text +
+
+
Categories:
+
Machines, Milk Pipe
+
-
-
Categories:
-
Machines, Milk Pipe
+
+
+
+
+
+
+

Description

+
+
+
+
+
+

+ Additional information +

+
+
+
+
+

Reviews (79)

+
+
+
+ Weight: +   5.2 kg
Dimensions(WxDxH)(cm): 17.1 x 39.3 x 30.8
Pressure: + 19 bar
Steam pipe for milk frothing
Warranty: 2 years +
-
-
-
-
-
-

Description

+
+

Similar Items

+
+
+
+ alt text +
+

Lattissima one

+

$ 660

-
-
-
-

- Additional information -

+
+
+ alt text
+

Creatista Plus

+

$ 750

-
-
-

Reviews (79)

+
+
+
+ alt text +
+

Pixie

+

$ 400

-
-
- Weight: -   5.2 kg
Dimensions(WxDxH)(cm): 17.1 x 39.3 x 30.8
Pressure: - 19 bar
Steam pipe for milk - frothing
Warranty: 2 years -
-
-

Similar Items

-
-
-
- alt text -
-

Lattissima one

-

$ 660

-
-
-
-
- alt text +
+
+
+
+
+
+ alt text +
+
+
+ This item added to your Shopping bag. +
-

Creatista Plus

-

$ 750

+
+
+ VIEW CART +
-
-
-
- alt text -
-

Pixie

-

$ 400

+
+
+
-
-
-
-
-
-
-
- alt text +
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
-
-
- This item added to your Shopping bag. +
+ © 2023 MadMach. Terms of use and privacy policy.
-
- VIEW CART -
-
-
-
-
-
-
-
- - -
-
- -
-
-
-
-
-
-
CONTACT
-
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
-
+ alt text
- alt text -
-
+ +
-
- - - + + + + diff --git a/src/views/layouts/ShopPage/ShopPage.css b/src/views/layouts/ShopPage/ShopPage.css index 738c2f7..6c7f3f9 100644 --- a/src/views/layouts/ShopPage/ShopPage.css +++ b/src/views/layouts/ShopPage/ShopPage.css @@ -6,13 +6,11 @@ position: relative; overflow: hidden; } - -.shop-page .main>.cell { +.shop-page .main > .cell { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__section1 { display: flex; flex-direction: column; @@ -20,7 +18,6 @@ flex-grow: 1; min-height: 1390px; } - .shop-page .section1__flexRow { display: flex; align-items: center; @@ -29,7 +26,6 @@ flex-grow: 1; margin: 161px auto 290px; } - .shop-page .section1__flexCol { display: flex; flex-direction: column; @@ -37,28 +33,24 @@ flex: 0 1 378px; margin: 0px 0px 447px; } - .shop-page .section1__title { font: 500 33px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - .shop-page .section1__flexCol1 { display: flex; flex-direction: column; position: relative; margin: 41px 26px 0px 0px; } - .shop-page .section1__group { display: flex; flex-direction: column; position: relative; margin: 0px 3px 0px 0px; } - .shop-page .section1__image7 { width: 21px; height: auto; @@ -70,42 +62,36 @@ top: 2px; right: 1px; } - .shop-page .section1__flexCol2 { display: flex; flex-direction: column; position: relative; flex-grow: 1; } - .shop-page .section1__text1 { font: 400 14px/1.57 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); letter-spacing: 0px; position: relative; } - .shop-page .section1__line1 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 11px 0px 0px; } - .shop-page .section1__flexCol3 { display: flex; flex-direction: column; position: relative; margin: 37px 1px 0px 2px; } - -.shop-page .section1__flexCol3>.cell { +.shop-page .section1__flexCol3 > .cell { display: flex; flex-direction: column; position: relative; z-index: 2; } - .shop-page .section1__rect1 { border-radius: 4px 4px 4px 4px; outline: 1px solid rgb(216, 216, 216); @@ -114,15 +100,13 @@ flex-grow: 1; min-height: 53px; } - -.shop-page .section1__flexCol3>.cell1 { +.shop-page .section1__flexCol3 > .cell1 { margin-top: -37px; display: flex; flex-direction: column; position: relative; z-index: 0; } - .shop-page .section1__text { font: 400 14px/1.57 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -131,15 +115,13 @@ flex-grow: 1; margin: 0px 16px; } - -.shop-page .section1__flexCol3>.cell2 { +.shop-page .section1__flexCol3 > .cell2 { margin-top: -15px; display: flex; flex-direction: column; position: relative; z-index: 4; } - .shop-page .section1__image4 { width: 100%; height: 100%; @@ -149,14 +131,12 @@ object-fit: cover; object-position: center center; } - -.shop-page .section1__flexCol3>.cell3 { +.shop-page .section1__flexCol3 > .cell3 { display: flex; flex-direction: column; position: relative; z-index: 3; } - .shop-page .section1__rect11 { border-radius: 4px 4px 4px 4px; outline: 1px solid rgb(216, 216, 216); @@ -166,37 +146,32 @@ min-height: 53px; margin: 39px 0px 0px; } - -.shop-page .section1__flexCol3>.cell4 { +.shop-page .section1__flexCol3 > .cell4 { margin-top: -38px; display: flex; flex-direction: column; position: relative; z-index: 1; } - -.shop-page .section1__flexCol3>.cell5 { +.shop-page .section1__flexCol3 > .cell5 { margin-top: -15px; display: flex; flex-direction: column; position: relative; z-index: 5; } - .shop-page .section1__flexCol4 { display: flex; flex-direction: column; position: relative; margin: 39px 0px 0px 2px; } - -.shop-page .section1__flexCol4>.cell { +.shop-page .section1__flexCol4 > .cell { display: flex; flex-direction: column; position: relative; z-index: 1; } - .shop-page .section1__rect2 { background-color: rgb(0, 0, 0); width: 0.57%; @@ -205,15 +180,13 @@ min-height: 10px; margin: 0px 0% 0px 99.43%; } - -.shop-page .section1__flexCol4>.cell1 { +.shop-page .section1__flexCol4 > .cell1 { margin-top: -10px; display: flex; flex-direction: column; position: relative; z-index: 2; } - .shop-page .section1__rect21 { background-color: rgb(0, 0, 0); width: 0.57%; @@ -222,15 +195,13 @@ min-height: 10px; margin: 0px 80.86% 0px 18.57%; } - -.shop-page .section1__flexCol4>.cell2 { +.shop-page .section1__flexCol4 > .cell2 { margin-top: -6px; display: flex; flex-direction: column; position: relative; z-index: 3; } - .shop-page .section1__flexCol5 { display: flex; flex-direction: column; @@ -238,13 +209,11 @@ flex-grow: 1; margin: 0px 1px 0px 0px; } - -.shop-page .section1__flexCol5>.cell { +.shop-page .section1__flexCol5 > .cell { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__image6 { width: calc(100% - 0px); height: auto; @@ -254,7 +223,6 @@ object-position: center center; position: relative; } - .shop-page .section1__text11 { font: 400 14px/1.57 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -262,15 +230,13 @@ position: relative; margin: 11px 0px 0px; } - -.shop-page .section1__flexCol4>.cell3 { +.shop-page .section1__flexCol4 > .cell3 { margin-top: -35px; display: flex; flex-direction: column; position: relative; z-index: 0; } - .shop-page .section1__line { background-color: rgb(0, 0, 0); width: 81.14%; @@ -278,14 +244,12 @@ position: relative; margin: 0px 0% 0px 18.86%; } - -.shop-page .section1__flexCol4>.cell4 { +.shop-page .section1__flexCol4 > .cell4 { display: flex; flex-direction: column; position: relative; z-index: 4; } - .shop-page .section1__text2 { display: flex; justify-content: flex-end; @@ -297,21 +261,18 @@ flex-grow: 1; margin: 11px 0px 0px; } - .shop-page .section1__flexRow1 { display: flex; align-items: center; position: relative; margin: 39px 2px 0px; } - .shop-page .section1__flexCol6 { display: flex; flex-direction: column; position: relative; flex: 0 1 78px; } - .shop-page .section1__highlights { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -319,7 +280,6 @@ position: relative; margin: 0px 3px 0px 0px; } - .shop-page .section1__highlights1 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -327,11 +287,9 @@ position: relative; margin: 42px 0px 0px; } - -.shop-page .section1__flexRow1>.spacer { +.shop-page .section1__flexRow1 > .spacer { flex: 0 1 236px; } - .shop-page .section1__flexCol7 { display: flex; flex-direction: column; @@ -339,13 +297,11 @@ flex: 0 1 33px; margin: 3px 0px; } - -.shop-page .section1__flexCol7>.cell { +.shop-page .section1__flexCol7 > .cell { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__image5 { width: 33px; height: auto; @@ -357,7 +313,6 @@ position: relative; min-width: 33px; } - .shop-page .section1__image51 { width: 33px; height: auto; @@ -370,12 +325,10 @@ min-width: 33px; margin: 50px 0px 0px; } - -.shop-page .section1__flexRow>.spacer { +.shop-page .section1__flexRow > .spacer { flex: 0 0 57px; min-width: 57px; } - .shop-page .section1__flexRow2 { display: flex; align-items: center; @@ -383,15 +336,13 @@ flex: 0 1 1195px; margin: 84px 0px 0px; } - -.shop-page .section1__flexRow2>.cell { +.shop-page .section1__flexRow2 > .cell { display: flex; flex-direction: column; position: relative; flex: 0 1 378px; z-index: 2; } - .shop-page .section1__flexCol8 { display: flex; flex-direction: column; @@ -402,17 +353,14 @@ flex-grow: 1; margin: 462px 0px 1px; } - .shop-page .section1__flexCol8:hover { transform: scale(1.1); } - -.shop-page .section1__flexCol8>.cell { +.shop-page .section1__flexCol8 > .cell { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__image2 { width: calc(100% - 0px); height: auto; @@ -423,7 +371,6 @@ object-position: center center; position: relative; } - .shop-page .section1__subtitle { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -431,7 +378,6 @@ position: relative; margin: 24px 0px 0px; } - .shop-page .section1__subtitle1 { font: 500 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -439,8 +385,7 @@ position: relative; margin: 16px 0px 0px; } - -.shop-page .section1__flexRow2>.cell1 { +.shop-page .section1__flexRow2 > .cell1 { margin-left: -378px; display: flex; flex-direction: column; @@ -448,7 +393,6 @@ flex: 0 1 378px; z-index: 4; } - .shop-page .section1__flexCol9 { display: flex; flex-direction: column; @@ -459,11 +403,9 @@ flex-grow: 1; margin: 0px 0px 463px; } - .shop-page .section1__flexCol9:hover { transform: scale(1.1); } - .shop-page .section1__content_box1 { display: flex; flex-direction: column; @@ -471,7 +413,6 @@ cursor: pointer; position: relative; } - .shop-page .section1__content_box { display: flex; flex-direction: column; @@ -482,7 +423,6 @@ flex-grow: 1; margin: 16px 79.37% 260px 5.29%; } - .shop-page .section1__info { font: 400 12px/1.66 "DM Sans", Helvetica, Arial, serif; color: rgb(255, 255, 255); @@ -491,7 +431,6 @@ flex-grow: 1; margin: 2px 5px 2px 10px; } - .shop-page .section1__flexCol10 { display: flex; flex-direction: column; @@ -499,18 +438,15 @@ position: relative; margin: 24px 45.77% 0px 0%; } - .shop-page .section1__subtitle2 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - -.shop-page .section1__flexRow2>.spacer { +.shop-page .section1__flexRow2 > .spacer { flex: 1 1 50px; } - .shop-page .section1__flexCol11 { display: flex; flex-direction: column; @@ -521,17 +457,14 @@ flex: 0 1 379px; margin: 0px 0px 463px; } - .shop-page .section1__flexCol11:hover { transform: scale(1.1); } - -.shop-page .section1__flexCol11>.cell { +.shop-page .section1__flexCol11 > .cell { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__image { width: calc(100% - 0px); height: auto; @@ -542,8 +475,7 @@ object-position: center center; position: relative; } - -.shop-page .section1__flexRow2>.cell2 { +.shop-page .section1__flexRow2 > .cell2 { margin-left: -379px; display: flex; flex-direction: column; @@ -551,7 +483,6 @@ flex: 0 1 379px; z-index: 5; } - .shop-page .section1__flexCol12 { display: flex; flex-direction: column; @@ -562,11 +493,9 @@ flex-grow: 1; margin: 462px 0px 0px; } - .shop-page .section1__flexCol12:hover { transform: scale(1.1); } - .shop-page .section1__content_box3 { display: flex; flex-direction: column; @@ -574,7 +503,6 @@ cursor: pointer; position: relative; } - .shop-page .section1__content_box2 { display: flex; flex-direction: column; @@ -585,7 +513,6 @@ flex-grow: 1; margin: 16px 81.53% 260px 2.11%; } - .shop-page .section1__info1 { font: 400 12px/1.66 "DM Sans", Helvetica, Arial, serif; color: rgb(255, 255, 255); @@ -594,7 +521,6 @@ flex-grow: 1; margin: 2px 6px 2px 8px; } - .shop-page .section1__subtitle11 { font: 500 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(161, 138, 104); @@ -602,15 +528,13 @@ position: relative; margin: 17px 0px 0px; } - -.shop-page .section1__flexRow2>.cell3 { +.shop-page .section1__flexRow2 > .cell3 { display: flex; flex-direction: column; position: relative; flex: 0 1 378px; z-index: 1; } - .shop-page .section1__image1 { width: calc(100% - 0px); height: auto; @@ -624,12 +548,10 @@ position: relative; margin: 0px 0px 463px; } - .shop-page .section1__image1:hover { transform: scale(1.1); } - -.shop-page .section1__flexRow2>.cell4 { +.shop-page .section1__flexRow2 > .cell4 { margin-left: -378px; display: flex; flex-direction: column; @@ -637,13 +559,11 @@ flex: 0 1 378px; z-index: 3; } - -.shop-page .section1__flexCol8>.cell1 { +.shop-page .section1__flexCol8 > .cell1 { display: flex; flex-direction: column; position: relative; } - .shop-page .section1__image3 { width: calc(100% - 0px); height: auto; @@ -654,7 +574,6 @@ object-position: center center; position: relative; } - .shop-page .section2 { position: relative; -} \ No newline at end of file +} diff --git a/src/views/layouts/ShopPage/ShopPage.html b/src/views/layouts/ShopPage/ShopPage.html index f90d93a..41d8e36 100644 --- a/src/views/layouts/ShopPage/ShopPage.html +++ b/src/views/layouts/ShopPage/ShopPage.html @@ -1,269 +1,369 @@ + + + - - - + + + - - - + + + + + + - - - - - - + + + + - - - - - - - - -
-
- -
-
-
-

Shop The Latest

-
-
- alt text -
-
Search...
-
-
-
-
-
-
-
-
-
Shop By
-
-
- alt text -
-
-
-
-
-
Sort By
-
-
- alt text -
-
-
-
-
+ + +
+
+ +
+
+
+

Shop The Latest

+
+
+ alt text +
+
Search...
+
+
-
-
+
+
+
+
Shop By
+
+
+ alt text +
+
+
+
Sort By
+
+
+ alt text +
-
-
-
- alt text +
+
+
+
+
+
+ alt text +
+
Price: $300 - $1500
-
Price: $300 - $1500
+
+
+
+
+
+
Filter
-
-
-
-
-
Filter
-
-
-
-
-
On sale
-
In stock
-
-
-
-
- alt text +
+
+
On sale
+
In stock
-
- alt text +
+
+
+ alt text +
+
+ alt text +
-
-
-
-
-
-
- alt text +
+
+
+
+
+ alt text +
+

Lattissima one

+

$ 660

-

Lattissima one

-

$ 660

-
-
-
-
+
+
-
-
- %20
+ " + class="section1__content_box1" + onclick="alert(`It is clickable`)" + > +
+
- %20
+
+
+
+

Nespresso Atelier

+

$ 550

-
-
-

Nespresso Atelier

-

$ 550

-
-
-
-
- alt text +
+
+
+ alt text +
+

CitiZ

+

$ 350

-

CitiZ

-

$ 350

-
-
-
-
+
+
-
-
Sold out
+ " + class="section1__content_box3" + onclick="alert(`It is clickable`)" + > +
+
Sold out
+
+

Pixie

+

$ 400

-

Pixie

-

$ 400

-
-
-
- alt text -
-
-
-
- alt text +
+
+ alt text +
+
+
+
+ alt text +
+

Creatista Plus

+

$ 750

-

Creatista Plus

-

$ 750

-
-
- -
-
- -
-
-
-
-
-
-
CONTACT
+
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
-
-
-
- - + + + + + + diff --git a/src/views/layouts/ViewOrder/ViewOrder.css b/src/views/layouts/ViewOrder/ViewOrder.css index 4aeb132..28af816 100644 --- a/src/views/layouts/ViewOrder/ViewOrder.css +++ b/src/views/layouts/ViewOrder/ViewOrder.css @@ -6,20 +6,17 @@ position: relative; overflow: hidden; } - -.view-order .main>.cell { +.view-order .main > .cell { display: flex; flex-direction: column; position: relative; } - .view-order .section1__section1 { display: flex; flex-direction: column; position: relative; flex-grow: 1; } - .view-order .section1__flexCol { display: flex; flex-direction: column; @@ -28,61 +25,51 @@ flex-grow: 1; margin: 220px auto 536px; } - @media (max-width: 1919px) { .view-order .section1__flexCol { width: 86.95%; } } - @media (max-width: 1399px) { .view-order .section1__flexCol { width: 89.89%; } } - @media (max-width: 1199px) { .view-order .section1__flexCol { width: 92.22%; } } - @media (max-width: 991px) { .view-order .section1__flexCol { width: 94.05%; } } - @media (max-width: 767px) { .view-order .section1__flexCol { width: 95.47%; } } - @media (max-width: 575px) { .view-order .section1__flexCol { width: 96.56%; } } - @media (max-width: 479px) { .view-order .section1__flexCol { width: 97.4%; } } - @media (max-width: 383px) { .view-order .section1__flexCol { width: 98.04%; } } - .view-order .section1__flexRow { display: flex; align-items: center; position: relative; } - .view-order .section1__subtitle { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -92,24 +79,20 @@ flex: 0 0 auto; min-width: 102px; } - @media (max-width: 1199px) { .view-order .section1__subtitle { font-size: 16px; text-align: left; } } - @media (max-width: 383px) { .view-order .section1__subtitle { font-size: 12px; } } - -.view-order .section1__flexRow>.spacer { +.view-order .section1__flexRow > .spacer { flex: 0 1 88px; } - .view-order .section1__group { display: flex; flex-direction: column; @@ -117,7 +100,6 @@ flex: 0 0 auto; min-width: 64px; } - .view-order .section1__line1 { background-color: rgb(0, 0, 0); height: 1px; @@ -126,7 +108,6 @@ left: -7px; right: -11px; } - .view-order .section1__subtitle1 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -134,20 +115,17 @@ position: relative; flex-grow: 1; } - @media (max-width: 1199px) { .view-order .section1__subtitle1 { font-size: 16px; text-align: left; } } - @media (max-width: 383px) { .view-order .section1__subtitle1 { font-size: 12px; } } - .view-order .section1__subtitle2 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -157,20 +135,17 @@ flex: 0 0 auto; min-width: 98px; } - @media (max-width: 1199px) { .view-order .section1__subtitle2 { font-size: 16px; text-align: left; } } - @media (max-width: 383px) { .view-order .section1__subtitle2 { font-size: 12px; } } - .view-order .section1__subtitle3 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -180,20 +155,17 @@ flex: 0 0 auto; min-width: 145px; } - @media (max-width: 1199px) { .view-order .section1__subtitle3 { font-size: 16px; text-align: left; } } - @media (max-width: 383px) { .view-order .section1__subtitle3 { font-size: 12px; } } - .view-order .section1__subtitle4 { font: 400 20px/1.3 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -203,34 +175,29 @@ flex: 0 0 auto; min-width: 65px; } - @media (max-width: 1199px) { .view-order .section1__subtitle4 { font-size: 16px; text-align: left; } } - @media (max-width: 383px) { .view-order .section1__subtitle4 { font-size: 12px; } } - .view-order .section1__line { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 34px 0px 0px 4px; } - .view-order .section1__flexRow1 { display: flex; align-items: center; position: relative; margin: 62px 0px 0px 4px; } - .view-order .section1__flexCol1 { display: flex; flex-direction: column; @@ -238,47 +205,40 @@ flex: 0 1 648px; margin: 0px 0px 84px; } - .view-order .section1__medium_title1 { font: 400 26px/1.34 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - @media (max-width: 991px) { .view-order .section1__medium_title1 { font-size: 20px; text-align: left; } } - @media (max-width: 767px) { .view-order .section1__medium_title1 { font-size: 16px; } } - @media (max-width: 383px) { .view-order .section1__medium_title1 { font-size: 12px; } } - .view-order .section1__flexRow2 { display: flex; align-items: center; position: relative; margin: 29px 0px 0px; } - .view-order .section1__flexCol2 { display: flex; flex-direction: column; position: relative; flex: 0 1 283px; } - .view-order .section1__flexCol3 { display: flex; flex-direction: column; @@ -286,21 +246,18 @@ position: relative; margin: 0px 45.94% 0px 0%; } - .view-order .section1__highlights { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - @media (max-width: 1199px) { .view-order .section1__highlights { font-size: 12px; text-align: left; } } - .view-order .section1__highlights2 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -308,14 +265,12 @@ position: relative; margin: 6px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights2 { font-size: 12px; text-align: left; } } - .view-order .section1__flexCol4 { display: flex; flex-direction: column; @@ -323,14 +278,12 @@ position: relative; margin: 39px 16.96% 0px 0%; } - .view-order .section1__flexCol5 { display: flex; flex-direction: column; position: relative; margin: 39px 0px 0px; } - .view-order .section1__flexCol6 { display: flex; flex-direction: column; @@ -338,7 +291,6 @@ position: relative; margin: 39px 57.6% 0px 0%; } - .view-order .section1__highlights21 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -346,18 +298,15 @@ position: relative; margin: 6px 4px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights21 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow2>.spacer { +.view-order .section1__flexRow2 > .spacer { flex: 1 1 174px; } - .view-order .section1__flexCol7 { display: flex; flex-direction: column; @@ -365,20 +314,17 @@ flex: 0 1 191px; margin: 0px 0px 4px; } - .view-order .section1__flexCol8 { display: flex; flex-direction: column; position: relative; margin: 0px 10px 0px 0px; } - @media (max-width: 991px) { .view-order .section1__flexCol8 { margin: 0px 4px 0px 0px; } } - .view-order .section1__highlights22 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -386,26 +332,22 @@ position: relative; margin: 6px 14px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights22 { font-size: 12px; text-align: left; } } - @media (max-width: 991px) { .view-order .section1__highlights22 { margin: 6px 8px 0px 0px; } } - @media (max-width: 479px) { .view-order .section1__highlights22 { margin: 6px 4px 0px 0px; } } - .view-order .section1__highlights1 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -413,14 +355,12 @@ position: relative; margin: 0px 6px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights1 { font-size: 12px; text-align: left; } } - .view-order .section1__highlights23 { font: 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -429,27 +369,23 @@ min-height: 141px; margin: 6px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights23 { font-size: 12px; text-align: left; } } - .view-order .section1__flexCol9 { display: flex; flex-direction: column; position: relative; margin: 24px 11px 0px 0px; } - @media (max-width: 767px) { .view-order .section1__flexCol9 { margin: 24px 4px 0px 0px; } } - .view-order .section1__highlights24 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -457,7 +393,6 @@ position: relative; margin: 2px 12px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights24 { font-size: 12px; @@ -465,50 +400,42 @@ margin: 2px 8px 0px 0px; } } - @media (max-width: 575px) { .view-order .section1__highlights24 { margin: 2px 4px 0px 0px; } } - -.view-order .section1__flexRow1>.spacer { +.view-order .section1__flexRow1 > .spacer { flex: 1 1 206px; } - .view-order .section1__flexCol10 { display: flex; flex-direction: column; position: relative; flex: 0 1 742px; } - .view-order .section1__medium_title { font: 26px/0.96 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; position: relative; } - @media (max-width: 991px) { .view-order .section1__medium_title { font-size: 20px; text-align: left; } } - @media (max-width: 767px) { .view-order .section1__medium_title { font-size: 16px; } } - @media (max-width: 383px) { .view-order .section1__medium_title { font-size: 12px; } } - .view-order .section1__content_box { display: flex; flex-direction: column; @@ -516,7 +443,6 @@ position: relative; margin: 39px 0px 0px; } - .view-order .section1__flexCol11 { display: flex; flex-direction: column; @@ -525,31 +451,26 @@ flex-grow: 1; margin: 39px auto; } - @media (max-width: 767px) { .view-order .section1__flexCol11 { width: 83.92%; } } - @media (max-width: 575px) { .view-order .section1__flexCol11 { width: 87.44%; } } - @media (max-width: 479px) { .view-order .section1__flexCol11 { width: 90.27%; } } - @media (max-width: 383px) { .view-order .section1__flexCol11 { width: 92.52%; } } - .view-order .section1__highlights3 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -558,18 +479,15 @@ flex: 0 0 auto; min-width: 94px; } - @media (max-width: 1199px) { .view-order .section1__highlights3 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow>.spacer1 { +.view-order .section1__flexRow > .spacer1 { flex: 0 1 449px; } - .view-order .section1__highlights4 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -578,28 +496,24 @@ flex: 0 0 auto; min-width: 48px; } - @media (max-width: 1199px) { .view-order .section1__highlights4 { font-size: 12px; text-align: left; } } - .view-order .section1__line2 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 17px 0px 0px; } - .view-order .section1__flexRow3 { display: flex; align-items: center; position: relative; margin: 21px 0px 0px; } - .view-order .section1__highlights11 { font: 400 16px/1.62 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -609,18 +523,15 @@ min-width: 43px; margin: 1px 0px 0px; } - @media (max-width: 1199px) { .view-order .section1__highlights11 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow3>.spacer { +.view-order .section1__flexRow3 > .spacer { flex: 0 1 508px; } - .view-order .section1__highlights25 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -629,21 +540,18 @@ flex: 0 0 auto; min-width: 40px; } - @media (max-width: 1199px) { .view-order .section1__highlights25 { font-size: 12px; text-align: left; } } - .view-order .section1__flexRow4 { display: flex; align-items: center; position: relative; margin: 27px 0px 0px; } - .view-order .section1__highlights26 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -652,18 +560,15 @@ flex: 0 0 auto; min-width: 142px; } - @media (max-width: 1199px) { .view-order .section1__highlights26 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow4>.spacer { +.view-order .section1__flexRow4 > .spacer { flex: 0 1 423px; } - .view-order .section1__highlights27 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -672,21 +577,18 @@ flex: 0 0 auto; min-width: 26px; } - @media (max-width: 1199px) { .view-order .section1__highlights27 { font-size: 12px; text-align: left; } } - .view-order .section1__flexRow5 { display: flex; align-items: center; position: relative; margin: 26px 0px 0px; } - .view-order .section1__highlights28 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -695,32 +597,27 @@ flex: 0 0 auto; min-width: 61px; } - @media (max-width: 1199px) { .view-order .section1__highlights28 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow5>.spacer { +.view-order .section1__flexRow5 > .spacer { flex: 0 1 504px; } - .view-order .section1__line21 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 11px 0px 0px; } - .view-order .section1__flexRow6 { display: flex; align-items: center; position: relative; margin: 16px 0px 0px; } - .view-order .section1__highlights5 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -729,18 +626,15 @@ flex: 0 0 auto; min-width: 98px; } - @media (max-width: 1199px) { .view-order .section1__highlights5 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow6>.spacer { +.view-order .section1__flexRow6 > .spacer { flex: 0 1 455px; } - .view-order .section1__highlights29 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -749,28 +643,24 @@ flex: 0 0 auto; min-width: 38px; } - @media (max-width: 1199px) { .view-order .section1__highlights29 { font-size: 12px; text-align: left; } } - .view-order .section1__line22 { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 10px 0px 0px; } - .view-order .section1__flexRow7 { display: flex; align-items: center; position: relative; margin: 15px 0px 0px; } - .view-order .section1__highlights6 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -779,18 +669,15 @@ flex: 0 0 auto; min-width: 89px; } - @media (max-width: 1199px) { .view-order .section1__highlights6 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow7>.spacer { +.view-order .section1__flexRow7 > .spacer { flex: 0 1 402px; } - .view-order .section1__highlights210 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -799,21 +686,18 @@ flex: 0 0 auto; min-width: 100px; } - @media (max-width: 1199px) { .view-order .section1__highlights210 { font-size: 12px; text-align: left; } } - .view-order .section1__flexRow8 { display: flex; align-items: center; position: relative; margin: 23px 0px 0px; } - .view-order .section1__highlights31 { font: 700 16px/1.31 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -822,18 +706,15 @@ flex: 0 0 auto; min-width: 64px; } - @media (max-width: 1199px) { .view-order .section1__highlights31 { font-size: 12px; text-align: left; } } - -.view-order .section1__flexRow8>.spacer { +.view-order .section1__flexRow8 > .spacer { flex: 0 1 488px; } - .view-order .section1__highlights32 { font: 700 16px/1.31 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); @@ -842,14 +723,12 @@ flex: 0 0 auto; min-width: 39px; } - @media (max-width: 1199px) { .view-order .section1__highlights32 { font-size: 12px; text-align: left; } } - .view-order .section2 { position: relative; -} \ No newline at end of file +} diff --git a/src/views/layouts/ViewOrder/ViewOrder.html b/src/views/layouts/ViewOrder/ViewOrder.html index d8693ae..8367359 100644 --- a/src/views/layouts/ViewOrder/ViewOrder.html +++ b/src/views/layouts/ViewOrder/ViewOrder.html @@ -1,241 +1,292 @@ + + + - - - + + + - - - + + + + + + + + + - - - - - - - - - - - - -
-
- -
-
-
-

- Dashboard -

-
-
-
-

Orders

-
-
-

- Addresses -

-
-

- Account details -

-
-

- Logout -

-
-
-
-
-

Order Details

-
-
-
-
ORDER NUMBER
-
943980998990
-
-
-
EMAIL
-
- Plonyalmony@gmail.com -
+
+
+
+
Shop
-
-
PAYMENT METHOD
-
- Mastercard*************7865 -
+

Our Story

+
+
+
+
+ alt text
-
-
ORDER DATE
-
May 8, 2023
+
+
+ alt text
-
-
-
-
-
DELIVERY OPTIONS
-
Standard delivery
-
-
-
DELIVERY ADDRESS
-
- 15 David Wolfson St
8 Apt, 2 Floor
Rishon - Lezion
7520323
Israel -
-
-
-
CONTACT NUMBER
-
+972 505055655
+
+
+ alt text
-
-
-

Order Summary

-
-
-
-
PRODUCT
-
-
TOTAL
-
-
-
-
CitiZ
-
-
$350
-
-
-
Espresso Cups
-
-
$10
-
-
-
Spoon
-
-
$10
-
-
-
-
SUBTOTAL
-
-
$370
+
+ + +
+
+ +
+
+
+

+ Dashboard +

+
+
+
+

Orders

+
+
+

+ Addresses +

+
+

+ Account details +

+
+

+ Logout +

+
+
+
+
+

Order Details

+
+
+
+
ORDER NUMBER
+
943980998990
+
+
+
EMAIL
+
+ Plonyalmony@gmail.com +
+
+
+
PAYMENT METHOD
+
+ Mastercard*************7865 +
+
+
+
ORDER DATE
+
May 8, 2023
+
-
-
-
SHIPPING
-
-
Free shipping
+
+
+
+
DELIVERY OPTIONS
+
Standard delivery
+
+
+
DELIVERY ADDRESS
+
+ 15 David Wolfson St
8 Apt, 2 Floor
Rishon + Lezion
7520323
Israel +
+
+
+
CONTACT NUMBER
+
+972 505055655
+
-
-
-
TOTAL
-
-
$370
+
+
+
+
+

Order Summary

+
+
+
+
PRODUCT
+
+
TOTAL
+
+
+
+
CitiZ
+
+
$350
+
+
+
Espresso Cups
+
+
$10
+
+
+
Spoon
+
+
$10
+
+
+
+
SUBTOTAL
+
+
$370
+
+
+
+
SHIPPING
+
+
Free shipping
+
+
+
+
TOTAL
+
+
$370
+
-
-
- -
-
- -
-
-
-
-
-
-
CONTACT
+
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy policy. +
+
-
TERMS OF SERVICES
-
-
SHIPPING AND RETURNS
-
-
- © 2023 MadMach. Terms of use and privacy - policy. -
-
-
-
-
-
- alt text -
Give an email, get the newsletter.
+
+
+
+ alt text +
Give an email, get the newsletter.
+
+
+
-
+ alt text
-
- alt text -
-
-
-
- - + + + + + + diff --git a/src/views/partials/Footer/Footer.css b/src/views/partials/Footer/Footer.css index 8baa78b..7657f1d 100644 --- a/src/views/partials/Footer/Footer.css +++ b/src/views/partials/Footer/Footer.css @@ -3,14 +3,12 @@ flex-direction: column; position: relative; } - .footer__line { background-color: rgb(216, 216, 216); height: 1px; position: relative; margin: 28px 0px 0px; } - .footer__group { display: flex; flex-direction: column; @@ -18,62 +16,52 @@ position: relative; margin: 25px auto 67px; } - @media (max-width: 1919px) { .footer__group { width: 86.95%; } } - @media (max-width: 1399px) { .footer__group { width: 89.89%; } } - @media (max-width: 1199px) { .footer__group { width: 92.22%; } } - @media (max-width: 991px) { .footer__group { width: 94.05%; } } - @media (max-width: 767px) { .footer__group { width: 95.47%; } } - @media (max-width: 575px) { .footer__group { width: 96.56%; } } - @media (max-width: 479px) { .footer__group { width: 97.4%; } } - @media (max-width: 383px) { .footer__group { width: 98.04%; } } - .footer__nullContent { display: flex; align-items: center; position: relative; flex-grow: 1; } - .footer__flexCol { display: flex; flex-direction: column; @@ -81,13 +69,11 @@ flex: 0 1 623px; margin: 15px 0px 0px; } - .footer__flexRow { display: flex; align-items: center; position: relative; } - .footer__highlights1 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -98,18 +84,15 @@ min-width: 94px; margin: 1px 0px 0px; } - @media (max-width: 1199px) { .footer__highlights1 { font-size: 12px; text-align: left; } } - -.footer__flexRow>.spacer { +.footer__flexRow > .spacer { flex: 0 1 52px; } - .footer__highlights11 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -120,18 +103,15 @@ min-width: 195px; margin: 0px 0px 1px; } - @media (max-width: 1199px) { .footer__highlights11 { font-size: 12px; text-align: left; } } - -.footer__flexRow>.spacer1 { +.footer__flexRow > .spacer1 { flex: 0 1 53px; } - .footer__highlights12 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -142,71 +122,60 @@ min-width: 229px; margin: 0px 0px 1px; } - @media (max-width: 1199px) { .footer__highlights12 { font-size: 12px; text-align: left; } } - .footer__highlights_box { position: relative; margin: 47px 0px 0px; } - @media (max-width: 1199px) { .footer__highlights_box { align-items: flex-start; justify-content: flex-start; } } - .footer__highlights { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); letter-spacing: 0px; } - @media (max-width: 1199px) { .footer__highlights { font-size: 12px; text-align: left; } } - .footer__highlights_span0 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .footer__highlights_span1 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - .footer__highlights_span2 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(0, 0, 0); font-style: normal; letter-spacing: 0px; } - .footer__highlights_span3 { font: 1em/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(111, 111, 111); font-style: normal; letter-spacing: 0px; } - -.footer__nullContent>.spacer { +.footer__nullContent > .spacer { flex: 1 1 469px; } - .footer__flexCol1 { display: flex; flex-direction: column; @@ -214,20 +183,17 @@ flex: 0 1 508px; margin: 0px 0px 8px; } - .footer__flexCol2 { display: flex; flex-direction: column; position: relative; } - .footer__group1 { display: flex; flex-direction: column; position: relative; bottom: 20px; } - .footer__image1 { width: 32px; height: auto; @@ -240,7 +206,6 @@ top: 10px; right: 0px; } - .footer__highlights13 { font: 400 16px/1.68 "DM Sans", Helvetica, Arial, serif; color: rgb(112, 112, 112); @@ -248,14 +213,12 @@ position: relative; flex-grow: 1; } - @media (max-width: 1199px) { .footer__highlights13 { font-size: 12px; text-align: left; } } - .footer__line1 { background-color: rgb(0, 0, 0); height: 1px; @@ -263,7 +226,6 @@ margin: 5px 0px 0px; bottom: 50px; } - .footer__image2 { width: 224px; height: auto; @@ -276,9 +238,4 @@ right: 0px; } -.email-input { - width: 280px; - padding-left: 3px; -} - -/*# sourceMappingURL=Footer.css.map */ \ No newline at end of file +/*# sourceMappingURL=Footer.css.map */ From 124579817d2ecb29404efc807d1aa7f841b5468b Mon Sep 17 00:00:00 2001 From: roee zach Date: Mon, 12 Jun 2023 13:52:06 +0300 Subject: [PATCH 4/4] Revert "Editing email input and arrow icon" This reverts commit 0a4371614aaa320f6b077c01d768647c2a49817f. --- src/views/layouts/Cart/Cart.html | 543 +++++++++++++++++-------------- 1 file changed, 292 insertions(+), 251 deletions(-) diff --git a/src/views/layouts/Cart/Cart.html b/src/views/layouts/Cart/Cart.html index cb049f4..65df661 100644 --- a/src/views/layouts/Cart/Cart.html +++ b/src/views/layouts/Cart/Cart.html @@ -1,26 +1,38 @@ + + - - - - - - + + + + + + + + + + + + + + + + + + + + + + + @@ -49,251 +61,274 @@ > - - +
+
+ +
+
+

Shopping Cart

+
+
+
+
+
+
+ alt text
-
-
-
-
-
-
1
-
-
+
-
-
-
-
- alt text +
+

CitiZ

+
Red
+
$ 350
-
-
-
-
- alt text -
+
+
+
+
-
-
-

BARISTA Cups

-
Grey / Large
-
$ 20
-
-
-
-
-
-
-
-
-
1
-
-
+
-
+
1
+
+
+
-
+
+
+
+ alt text +
+
+
+
+
- alt text + alt text +
+
+
+

BARISTA Cups

+
Grey / Large
+
$ 20
-
-
-
-
- alt text -
+
+
+
+
-
-
-

ORIGIN Cups

-
White / Medium
-
$ 10
-
-
-
-
-
-
-
-
-
1
-
-
+
-
-
-
-
- alt text +
1
+
+
+
-
-
-

UPDATE CART

+
+
+ alt text
-
-
-
Coupon Code
-
+
+
+
+
+
+ alt text
-
-

APPLY COUPON

+
+

ORIGIN Cups

+
White / Medium
+
$ 10
+
+
+
+
-
+
+
1
+
+
+
+
+
+
+
+ alt text +
+
+
+
+

UPDATE CART

+
+
+
+
+ +
+
+
+
+

APPLY COUPON

+ +
-
-
-
-
-

Cart totals

-
-
-
-
- SUBTOTAL

 -
-
-
$380
-
-
-
-
-
- SHIPPING -  
 -
-
-
- Shipping costs will be calculated once you have - provided address.
-
-
+
+
+
+
+
+

Cart totals

+
+
+
+
+ SUBTOTAL

 +
+
+
$380
-
-
-
- CALCULATE SHIPPING +
+
+
+ SHIPPING +
-
SELECT A COUNTRY
-
-
-
CITY
-
-
- alt text -
+
+
+ Shipping costs will be calculated once you have + provided address.
+
+
+
+
+
+
+
+ CALCULATE SHIPPING +
+
SELECT A COUNTRY
+
+
+
CITY
+
+
+ alt text
+
+
+
POST CODE / ZIP
+
+
+

UPDATE TOTALS

+
+
+
+
+
TOTAL
+
+
$380
+
+
+
+

+ PROCEED TO CHECKOUT +

+
+
+
+
+
+
+
+ +
+
+ +
+
+
+
+
+
+
CONTACT
+
+
TERMS OF SERVICES
+
+
SHIPPING AND RETURNS
+
+
+ © 2023 MadMach. Terms of use and privacy + policy. +
+
+
+
+
+
+
+ +
+
+ A clickable arrow to submit email +
POST CODE / ZIP
@@ -365,20 +400,26 @@
Give an email, get the newsletter.
+

+
- alt text
-
-
-
- + - const header = document.querySelector("#header"); - if (header) { - const headroom = new Headroom(header); - headroom.init(); - } - - - + \ No newline at end of file