add container helpers; constuct public directory-tree

4 files changed, 320 insertions, 0 deletions

diff --git a/html/processed-views/content/Basket/Basket.html b/html/processed-views/content/Basket/Basket.html
new file mode 100644
index 0000000..b69c83b
--- /dev/null
+++ b/html/processed-views/content/Basket/Basket.html
@@ -0,0 +1,40 @@
+<nav role="navigation" class="breadcrumb">
+    <div class="wrapper">
+        <nav class="breadcrumb__inner scrollbar" data-plugin-breadcrumb>
+            <ul class="breadcrumb__list">
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket.html#">Home</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket.html#">Page 1</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket.html#">Page 2</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket.html#">Page 3</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket.html#">Page 4</a></li>
+                <li class="breadcrumb__item">Product List</li>
+            </ul>
+        </nav>
+    </div>
+</nav>
+
+<div class="infoPopup">
+    <button class="iconButton icon-close infoPopup__remove" data-plugin-infoPopup></button>
+    <p class="infoPopup__title">“Dior Addict stelar shine”</p>
+    <p>προστέθηκε στο καλάθι σας</p>
+    <a href="Basket.html#" class="link">Προβολή καλαθιού</a>
+</div>
+
+<div class="wrapper">
+    <div class="pageTitle">
+        <h1>Το καλάθι μου</h1>
+    </div>
+</div>
+
+<div class="wrapper">
+    <div class="basketMain mainLayout mainLayout--rightAside">
+        <div class="basketMain__content mainLayout__content">
+            <div class="basketTable">
+                <div class="basketTable__body">
+                    <!-- For loop Basket_item.html -->
+                </div>
+            </div>
+        </div>
+        <!-- Basket_aside.html -->
+    </div>
+</div>
\ No newline at end of file
diff --git a/html/processed-views/content/Basket/Basket_Item.html b/html/processed-views/content/Basket/Basket_Item.html
new file mode 100644
index 0000000..d43aa39
--- /dev/null
+++ b/html/processed-views/content/Basket/Basket_Item.html
@@ -0,0 +1,104 @@
+<div class="basketTable__row">
+    <button class="iconButton icon-delete basketTable__remove"></button>
+    <div class="basketTable__cell basketTable__cell--product">
+        <div class="product">
+            <div class="product__inner">
+                <div data-plugin-wishlistbutton class="wishlistButton">
+                    <button
+                        class="fav iconButton iconButton--s icon-heart listsClose"></button>
+                    <div class="listsBlock">
+                        <div class="listsBlock__bg listsClose"></div>
+                        <div class="listsBlock__inner">
+                            <div class="listsBlock__title">Προσθήκη σε:</div>
+                            <button class="listsBlock__close iconButton iconButton--xs icon-close listsClose"></button>
+                            <div class="listsBlock__list">
+                                <div class="listsBlock__item checkbox">
+                                    <label class="checkbox__label" for="list_0">
+                                        <input class="checkbox__input filter__input" type="checkbox" id="list_0" name="list" value="fav">
+                                        <span class="checkbox__icon"></span>
+                                        <span class="listsBlock__name icon-fav">Aγαπημένα</span>
+                                    </label>
+                                </div>
+                                <div class="listsBlock__item checkbox">
+                                    <label class="checkbox__label" for="list_1">
+                                        <input class="checkbox__input filter__input" type="checkbox" id="list_1" name="list" value="summer">
+                                        <span class="checkbox__icon"></span>
+                                        <span class="listsBlock__name icon-mylists-sun">Καλοκαίρι 2021</span>
+                                    </label>
+                                </div>
+                                <div class="listsBlock__item checkbox">
+                                    <label class="checkbox__label" for="list_2">
+                                        <input class="checkbox__input filter__input" type="checkbox" id="list_2" name="list" value="birthday">
+                                        <span class="checkbox__icon"></span>
+                                        <span class="listsBlock__name icon-mylists-balloon">Γενέθλια</span>
+                                    </label>
+                                </div>
+                            </div>
+                            <a href="Basket.html#" class="link link--m link--orangeIcon"><span class="icon icon-addCircle"></span>Νέα Λίστα</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="product__img">
+                    <figure>
+                        <picture>
+                            <source data-srcset="/images/300x300/png/Content/media/sampleProduct.webp" type="image/webp" class="lazysrcset" />
+                            <source data-srcset="/images/300x300/png/Content/media/sampleProduct.jp2" type="image/jp2" class="lazysrcset" />
+                            <img data-src="/images/300x300/png/Content/media/sampleProduct.png" alt="product" class="lazy" />
+                        </picture>
+                    </figure>
+                </div>
+                <a href="Basket.html#" class="product__title">
+                    Title of product
+                </a>
+                <div class="product__more">
+                    <div class="product__quantity">
+                        <div class="quantity quantity--init"
+                            data-plugin-quantity={"MaxQuantity":10}>
+                            <button class="quantity__btn quantity__btn--dec disabled"
+                                data-ref="quantity-control"></button>
+                            <input class="quantity__input" value="1" type="text"
+                                readonly aria-label="quantity">
+                            <button class="quantity__btn quantity__btn--inc"
+                                data-ref="quantity-control"></button>
+                            <div class="quantity__message quantity__message--added">
+                                Προστεθηκε στο καλάθι σας</div>
+                            <div class="quantity__message quantity__message--removed">
+                                Αφαιρεθηκε απο το καλάθι σας</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="basketTable__cell basketTable__cell--price">
+        <div class="priceContainer">
+            <div class="priceBlock__price priceBlock__price--init">
+                58,20 €
+            </div>
+            <div class="priceBlock__price">
+                45,10 €
+            </div>
+        </div>
+    </div>
+    <div class="basketTable__cell basketTable__cell--quant">
+        <div class="quantity quantity--init" data-plugin-quantity={"MaxQuantity":10}>
+            <button class="quantity__btn quantity__btn--dec disabled"
+                data-ref="quantity-control"></button>
+            <input class="quantity__input" value="1" type="text" readonly
+                aria-label="quantity">
+            <button class="quantity__btn quantity__btn--inc"
+                data-ref="quantity-control"></button>
+            <div class="quantity__message quantity__message--added">Προστεθηκε στο
+                καλάθι σας</div>
+            <div class="quantity__message quantity__message--removed">Αφαιρεθηκε απο το
+                καλάθι σας</div>
+        </div>
+    </div>
+    <div class="basketTable__cell basketTable__cell--price basketTable__cell--total">
+        <div class="priceContainer">
+            <div class="priceBlock__price">
+                45,10 €
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/html/processed-views/content/Basket/Basket_aside.html b/html/processed-views/content/Basket/Basket_aside.html
new file mode 100644
index 0000000..6c693fd
--- /dev/null
+++ b/html/processed-views/content/Basket/Basket_aside.html
@@ -0,0 +1,140 @@
+<aside class="basketMain__aside mainLayout__aside">
+    <div class="sideBasket">
+        <h3 class="sideBasket__title">ΣΥΝΟΨΗ ΠΑΡΑΓΓΕΛΙΑΣ</h3>
+        <div class="sideBasket__inner productsSum">
+            <div class="priceRow">
+                <span>5 προϊόντα</span>
+                <div class="priceContainer">
+                    <div class="priceBlock__price">
+                        1.246,10 €
+                    </div>
+                </div>
+            </div>
+            <div class="progressBlock">
+                <div class="progressBlock__info">
+                    <span class="progressBlock__remain">9,60</span> € ακόμα για δωρεάν μεταφορικά
+                </div>
+                <div class="progressBlock__bar">
+                    <div class="progressBlock__progress" style="width: 60%"></div>
+                </div>
+            </div>
+            <div class="priceRow">
+                <span class="row row--vCenter">
+                    <span>Μεταφορικά</span>
+                    <span class="tooltip" data-plugin-tooltip>
+                        <button class="iconButton tooltip__btn icon-info"></button>
+                        <span class="tooltip__main">Lorem ipsum dolor sit amet.</span>
+                    </span>
+                </span>
+                <div class="priceContainer">
+                    <div class="priceBlock__price">
+                        4,90 €
+                    </div>
+                </div>
+            </div>
+            <div class="accordions" data-plugin-accordion>
+                <div class="acc acc--inline couponBlock">
+                    <div class="acc__header">
+                        Eκπτωτικό κουπόνι
+                        <button class="icon-arrowDown acc__icon"></button>
+                    </div>
+                    <div class="acc__content">
+                        <form class="form couponBlock__form" data-qa="form_coupon">
+                            <div class="field couponBlock__field">
+                                <div class="field__inner">
+                                    <div class="field__wrap ">
+                                        <input class="field__input field__input--inline" id="couponcode" type="text" placeholder="&#x3BA;&#x3C9;&#x3B4;&#x3B9;&#x3BA;&#x3CC;&#x3C2;" aria-label="&#x3BA;&#x3C9;&#x3B4;&#x3B9;&#x3BA;&#x3CC;&#x3C2;" />
+                                    </div>
+                                    <button data-qa="form_coupon_submit"
+                                        class="couponBlock__btn widthAuto" type="submit"></button>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+                <div class="acc acc--inline couponBlock">
+                    <div class="acc__header">
+                        Eκπτωτικό κουπόνι
+                        <button class="icon-arrowDown acc__icon"></button>
+                    </div>
+                    <div class="acc__content">
+                        <form class="form couponBlock__form" data-qa="form_coupon">
+                            <div class="field field--error couponBlock__field">
+                                <div class="field__inner">
+                                    <div class="field__wrap ">
+                                        <input class="field__input field__input--inline" id="couponcode" type="text" placeholder="&#x3BA;&#x3C9;&#x3B4;&#x3B9;&#x3BA;&#x3CC;&#x3C2;" aria-label="&#x3BA;&#x3C9;&#x3B4;&#x3B9;&#x3BA;&#x3CC;&#x3C2;" />
+                                    </div>
+                                    <button data-qa="form_coupon_submit" class="couponBlock__btn widthAuto" type="submit"></button>
+                                </div>
+                                <p class="errorMsg">Ο κωδικός που έχετε εισάγει δεν αναγνωρίζεται.
+                                    Παρακαλούμε, ελέγξτε τον & δοκιμάστε ξανά.</p>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+                <div class="acc acc--inline couponBlock">
+                    <div class="acc__header">
+                        Eκπτωτικό κουπόνι
+                        <button class="icon-arrowDown acc__icon"></button>
+                    </div>
+                    <div class="acc__content">
+                        <form class="form couponBlock__form" data-qa="form_coupon">
+                            <div class="field couponBlock__field completed">
+                                <div class="field__inner">
+                                    <div class="field__wrap">
+                                        <input class="field__input field__input--inline" id="couponcode" type="text" placeholder="κωδικός" aria-label="κωδικός" readonly value="123456" />
+                                    </div>
+                                    <button class="couponBlock__clear"></button>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+                <div class="priceRow priceRow--coupon">
+                    <span>COUPON NAME</span>
+                    <div class="priceContainer">
+                        <div class="priceBlock__price">
+                            - 15,90 €
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="priceRow priceRow--total">
+                <span>Τελικό Σύνολο</span>
+                <div class="priceContainer">
+                    <div class="priceBlock__price">
+                        1.246,10 €
+                    </div>
+                </div>
+            </div>
+            <button class="button button--full">Προχωρήστε σε αγορά</button>
+            <div class="orDivider">
+                <span class="orDivider__text">ή</span>
+            </div>
+            <button class="button button--full">Αγορά μέσω Paypal</button>
+        </div>
+        <div class="cards">
+            <figure>
+                <picture>
+                    <source data-srcset="/images/h20/png/Content/media/cards/visa.webp" type="image/webp" class="lazysrcset" />
+                    <source data-srcset="/images/h20/png/Content/media/cards/visa.jp2" type="image/jp2" class="lazysrcset" />
+                    <img data-src="/images/h20/png/Content/media/cards/visa.png" alt="Alt text" class="lazy" />
+                </picture>
+            </figure>
+            <figure>
+                <picture>
+                    <source data-srcset="/images/h20/png/Content/media/cards/mastercard.webp" type="image/webp" class="lazysrcset" />
+                    <source data-srcset="/images/h20/png/Content/media/cards/mastercard.jp2" type="image/jp2" class="lazysrcset" />
+                    <img data-src="/images/h20/png/Content/media/cards/mastercard.png" alt="Alt text" class="lazy" />
+                </picture>
+            </figure>
+            <figure>
+                <picture>
+                    <source data-srcset="/images/h20/png/Content/media/cards/dinersClub.webp" type="image/webp" class="lazysrcset" />
+                    <source data-srcset="/images/h20/png/Content/media/cards/dinersClub.jp2" type="image/jp2" class="lazysrcset" />
+                    <img data-src="/images/h20/png/Content/media/cards/dinersClub.png" alt="Alt text" class="lazy" />
+                </picture>
+            </figure>
+        </div>
+    </div>
+</aside>
\ No newline at end of file
diff --git a/html/processed-views/content/Basket/Basket_empty.html b/html/processed-views/content/Basket/Basket_empty.html
new file mode 100644
index 0000000..9ee3383
--- /dev/null
+++ b/html/processed-views/content/Basket/Basket_empty.html
@@ -0,0 +1,36 @@
+<nav role="navigation" class="breadcrumb">
+    <div class="wrapper">
+        <nav class="breadcrumb__inner scrollbar" data-plugin-breadcrumb>
+            <ul class="breadcrumb__list">
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket&#32;Empty.html#">Home</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket&#32;Empty.html#">Page 1</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket&#32;Empty.html#">Page 2</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket&#32;Empty.html#">Page 3</a></li>
+                <li class="breadcrumb__item"><a class="breadcrumb__itemLink" href="Basket&#32;Empty.html#">Page 4</a></li>
+                <li class="breadcrumb__item">Product List</li>
+            </ul>
+        </nav>
+    </div>
+</nav>
+
+<div class="wrapper">
+    <div class="pageTitle">
+        <h1>Το καλάθι μου</h1>
+    </div>
+</div>
+
+<div class="wrapper">
+	<div class="emptyContent">
+		<div class="emptyContent__img">
+			<div class="icon-basket"></div>
+		</div>
+		<div class="emptyContent__text">
+			<p class="text text--b">Το καλάθι σας είναι άδειο.</p>
+			<p>Ήρθε η ώρα να το γεμήσετε! Εξερευνήστε τα προϊόντα μας</p>
+		</div>
+		<div class="emptyContent__btns">
+			<a href="Basket&#32;Empty.html#" class="button">Εξερευνήστε</a>
+			<a href="Basket&#32;Empty.html#" class="button button--border">Προβολή αγαπημένων</a>
+		</div>
+	</div>
+</div>
\ No newline at end of file