add container helpers; constuct public directory-tree

1 files changed, 576 insertions, 0 deletions

diff --git a/html/processed-views/content/product/product_details.php b/html/processed-views/content/product/product_details.php
new file mode 100644
index 0000000..b00ea6c
--- /dev/null
+++ b/html/processed-views/content/product/product_details.php
@@ -0,0 +1,576 @@
+<div class="productPage">
+
+    <!-- product images -->
+    <div class="productPage__imageCol">
+        <div class="productPage__imageGrid" data-plugin-productimagemodal="">
+
+            <?php $isFirst = false; ?>
+            <?php foreach($product['Images'] as $image) : ?>
+
+                <div class="productPage__image<?= ($isFirst)
+                        ? ' productPage__image--b'
+                        : '' ?>">
+                    <?php $isFirst = true; ?>
+
+                    <figure>
+                        <picture>
+                            <!--
+                            <source data-srcset="/images/624x624/png/Content/media/sampleProduct.webp" type="image/webp"
+                                class="lazysrcset"> -->
+                            <source data-srcset="https://s1.sklavenitis.gr/images/1600x1600/40/<?=$image['Url']?>" type="image/jp2"
+                                class="lazysrcset">
+                            <img data-src="https://s1.sklavenitis.gr/images/1600x1600/40/<?=$image['Url']?>" alt="product" class="lazy">
+                        </picture>
+                    </figure>
+
+                </div>
+
+            <?php endforeach; ?>
+       
+        </div>
+    </div>
+
+    <!-- info -->
+    <div class="productPage__info productInfo">
+        <p class="productInfo__flag">FLAG</p>
+        <h1 class="productInfo__title"><?=  $product['Title'] ?></h1>
+
+        <p class="productInfo__desc"><?=    html($product['Description']) ?></p>
+
+        <p class="productInfo__code"><?=    $product['SKU'] ?></p>
+
+        <div class="priceContainer">
+
+            <?php if ($product['DiscountPrice']) : ?>
+
+                <span class="priceBlock__text">από</span>
+                <div class="priceBlock__price priceBlock__price--init">
+                    <?=
+                    $product['Price']
+                    ?> €
+                </div>
+            <?php endif; ?>
+
+            <div class="priceBlock__price">
+                <?=
+                $product['DiscountPrice']
+                ?> €
+            </div>
+            <!--
+            <div class="priceBlock__price priceBlock__price--percentage">
+                40%
+            </div>
+            -->
+        </div>
+<?php
+    /* ---
+        <div class="productInfo__attr productAttr" data-plugin-productattr="">
+            <div class="productAttr__title">
+                <label class="productAttr__label">ΧΡΩΜΑ</label>
+                <span class="productAttr__selected">
+                    <span class="productAttr__selectedDefault">Επιλέξτε</span>
+                </span>
+            </div>
+
+            <!-- color ?? -->
+            <!--
+            <fieldset>              
+                <legend class="field__label">ΧΡΩΜΑ</legend>               
+                <div class="radiobuttons radiobuttons--colors">
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_0">
+                            <input class="radiobutton__input" type="radio" id="color_0" name="color" value="Item_0">
+                            <span class="radiobutton__icon" style="background-color:#995242"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_1">
+                            <input class="radiobutton__input" type="radio" id="color_1" name="color" value="Item_1">
+                            <span class="radiobutton__icon" style="background-color:#861724"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_2">
+                            <input class="radiobutton__input" type="radio" id="color_2" name="color" value="Item_2">
+                            <span class="radiobutton__icon" style="background-color:#202457"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_3">
+                            <input class="radiobutton__input" type="radio" id="color_3" name="color" value="Item_3">
+                            <span class="radiobutton__icon" style="background-color:#555775"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_4">
+                            <input class="radiobutton__input" type="radio" id="color_4" name="color" value="Item_4">
+                            <span class="radiobutton__icon" style="background-color:#164502"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_5">
+                            <input class="radiobutton__input" type="radio" id="color_5" name="color" value="Item_5">
+                            <span class="radiobutton__icon" style="background-color:#275276"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_6">
+                            <input class="radiobutton__input" type="radio" id="color_6" name="color" value="Item_6">
+                            <span class="radiobutton__icon" style="background-color:#266400"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_7">
+                            <input class="radiobutton__input" type="radio" id="color_7" name="color" value="Item_7">
+                            <span class="radiobutton__icon" style="background-color:#981225"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_8">
+                            <input class="radiobutton__input" type="radio" id="color_8" name="color" value="Item_8">
+                            <span class="radiobutton__icon" style="background-color:#455296"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_9">
+                            <input class="radiobutton__input" type="radio" id="color_9" name="color" value="Item_9">
+                            <span class="radiobutton__icon" style="background-color:#651336"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_10">
+                            <input class="radiobutton__input" type="radio" id="color_10" name="color" value="Item_10">
+                            <span class="radiobutton__icon" style="background-color:#353211"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_11">
+                            <input class="radiobutton__input" type="radio" id="color_11" name="color" value="Item_11">
+                            <span class="radiobutton__icon" style="background-color:#521059"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_12">
+                            <input class="radiobutton__input" type="radio" id="color_12" name="color" value="Item_12">
+                            <span class="radiobutton__icon" style="background-color:#654818"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_13">
+                            <input class="radiobutton__input" type="radio" id="color_13" name="color" value="Item_13">
+                            <span class="radiobutton__icon" style="background-color:#249666"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_14">
+                            <input class="radiobutton__input" type="radio" id="color_14" name="color" value="Item_14">
+                            <span class="radiobutton__icon" style="background-color:#964632"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_15">
+                            <input class="radiobutton__input" type="radio" id="color_15" name="color" value="Item_15">
+                            <span class="radiobutton__icon" style="background-color:#690375"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_16">
+                            <input class="radiobutton__input" type="radio" id="color_16" name="color" value="Item_16">
+                            <span class="radiobutton__icon" style="background-color:#240711"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_17">
+                            <input class="radiobutton__input" type="radio" id="color_17" name="color" value="Item_17">
+                            <span class="radiobutton__icon" style="background-color:#901481"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_18">
+                            <input class="radiobutton__input" type="radio" id="color_18" name="color" value="Item_18">
+                            <span class="radiobutton__icon" style="background-color:#897961"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_19">
+                            <input class="radiobutton__input" type="radio" id="color_19" name="color" value="Item_19">
+                            <span class="radiobutton__icon" style="background-color:#590235"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_20">
+                            <input class="radiobutton__input" type="radio" id="color_20" name="color" value="Item_20">
+                            <span class="radiobutton__icon" style="background-color:#729859"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_21">
+                            <input class="radiobutton__input" type="radio" id="color_21" name="color" value="Item_21">
+                            <span class="radiobutton__icon" style="background-color:#555851"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_22">
+                            <input class="radiobutton__input" type="radio" id="color_22" name="color" value="Item_22">
+                            <span class="radiobutton__icon" style="background-color:#284260"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_23">
+                            <input class="radiobutton__input" type="radio" id="color_23" name="color" value="Item_23">
+                            <span class="radiobutton__icon" style="background-color:#454939"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_24">
+                            <input class="radiobutton__input" type="radio" id="color_24" name="color" value="Item_24">
+                            <span class="radiobutton__icon" style="background-color:#972644"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor">
+                        <label class="radiobutton__label" for="color_25">
+                            <input class="radiobutton__input" type="radio" id="color_25" name="color" value="Item_25">
+                            <span class="radiobutton__icon" style="background-color:#622680"></span>
+                        </label>
+                    </div>
+                    <div class="radiobutton radiobutton--onlyColor disabled">
+                        <label class="radiobutton__label" for="color_26">
+                            <input class="radiobutton__input" type="radio" id="color_26" name="color" value="Item_26"
+                                disabled="">
+                            <span class="radiobutton__icon">
+
+                                <figure>
+                                    <picture>
+                                        <source data-srcset="/images/32x32/png/Content/media/sampleColor.webp"
+                                            type="image/webp" class="lazysrcset">
+                                        <source data-srcset="/images/32x32/png/Content/media/sampleColor.jp2"
+                                            type="image/jp2" class="lazysrcset">
+
+
+                                        <img data-src="/images/32x32/png/Content/media/sampleColor.png" alt="Alt text"
+                                            class="lazy">
+                                    </picture>
+                                </figure>
+                            </span>
+                        </label>
+                    </div>
+                </div>
+            </fieldset>
+            -->
+        </div>
+
+        <div class="productInfo__attr productAttr" data-plugin-productattr="">
+            <div class="productAttr__title">
+                <label class="productAttr__label">MEΓΕΘΟΣ</label>
+                <span class="productAttr__selected">
+                    <span class="productAttr__selectedDefault">Επιλέξτε</span>
+                </span>
+            </div>
+            <!-- size ?? -->
+            <!--
+            <div class="productAttr__main">
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_0">
+                        <input class="radiobutton__input" type="radio" id="size_0" name="size" value="Item_0">
+                        <span class="radiobutton__text">Item0</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_1">
+                        <input class="radiobutton__input" type="radio" id="size_1" name="size" value="Item_1">
+                        <span class="radiobutton__text">Item1</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_2">
+                        <input class="radiobutton__input" type="radio" id="size_2" name="size" value="Item_2">
+                        <span class="radiobutton__text">Item2</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_3">
+                        <input class="radiobutton__input" type="radio" id="size_3" name="size" value="Item_3">
+                        <span class="radiobutton__text">Item3</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_4">
+                        <input class="radiobutton__input" type="radio" id="size_4" name="size" value="Item_4">
+                        <span class="radiobutton__text">Item4</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_5">
+                        <input class="radiobutton__input" type="radio" id="size_5" name="size" value="Item_5">
+                        <span class="radiobutton__text">Item5</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_6">
+                        <input class="radiobutton__input" type="radio" id="size_6" name="size" value="Item_6">
+                        <span class="radiobutton__text">Item6</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button">
+                    <label class="radiobutton__label" for="size_7">
+                        <input class="radiobutton__input" type="radio" id="size_7" name="size" value="Item_7">
+                        <span class="radiobutton__text">Item7</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+                <div class="radiobutton radiobutton--button disabled">
+                    <label class="radiobutton__label" for="size_8">
+                        <input class="radiobutton__input" type="radio" id="size_8" name="size" value="Item_8"
+                            disabled="">
+                        <span class="radiobutton__text">Item8</span>
+                        <span class="radiobutton__icon"></span>
+                    </label>
+                </div>
+            </div>
+            -->
+        </div>
+    --- */
+?>
+
+<?php
+    /*---
+        <div class="addProduct">
+            <div class="quantity quantity--init" data-plugin-quantity="{&quot;MaxQuantity&quot;: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>
+            <button class="addToCartButton button button--icon" id="addToCartButton">
+                <span class="addToCartButton__text addToCartButton__text--default">Προσθηκη στο καλαθι</span>
+                <span class="addToCartButton__text addToCartButton__text--added">Προστεθηκε στο καλαθι</span>
+                <span class="loader">
+                    <span class="loader__inner">
+                        <span class="loader__item loader__item--1"></span>
+                        <span class="loader__item loader__item--2"></span>
+                        <span class="loader__item loader__item--3"></span>
+                    </span>
+                </span>
+            </button>
+            <button class="fav iconButton icon-heart"></button>
+        </div>
+
+        <div class="cartAdd error-message">
+            Please select color &amp; size
+        </div>
+
+        <div class="addProduct">
+
+            <div class="quantity quantity--init" data-plugin-quantity="{&quot;MaxQuantity&quot;: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>
+            <button class="addToCartButton button button--icon addToCartButton--added">
+                <span class="addToCartButton__text addToCartButton__text--default">Προσθηκη στο καλαθι</span>
+                <span class="addToCartButton__text addToCartButton__text--added">Προστεθηκε στο καλαθι</span>
+                <span class="loader">
+                    <span class="loader__inner">
+                        <span class="loader__item loader__item--1"></span>
+                        <span class="loader__item loader__item--2"></span>
+                        <span class="loader__item loader__item--3"></span>
+                    </span>
+                </span>
+            </button>
+            <button class="fav iconButton icon-heart"></button>
+        </div>
+
+        <div class="addProduct">
+
+            <div class="quantity quantity--init" data-plugin-quantity="{&quot;MaxQuantity&quot;: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>
+            <button class="addToCartButton button button--icon addToCartButton--loading">
+                <span class="addToCartButton__text addToCartButton__text--default">Προσθηκη στο καλαθι</span>
+                <span class="addToCartButton__text addToCartButton__text--added">Προστεθηκε στο καλαθι</span>
+                <span class="loader">
+                    <span class="loader__inner">
+                        <span class="loader__item loader__item--1"></span>
+                        <span class="loader__item loader__item--2"></span>
+                        <span class="loader__item loader__item--3"></span>
+                    </span>
+                </span>
+            </button>
+            <button class="fav iconButton icon-heart"></button>
+        </div>
+
+        <div class="addProduct">
+            <div class="notifyMe" data-plugin-expand="">
+                <button class="button button--border notifyMe__button" data-trigger-expand="notifyme">
+                    <span class="notifyMe__buttonText">Eνημέρωση διαθεσιμότητας</span>
+                    <span class="loader">
+                        <span class="loader__inner">
+                            <span class="loader__item loader__item--1"></span>
+                            <span class="loader__item loader__item--2"></span>
+                            <span class="loader__item loader__item--3"></span>
+                        </span>
+                    </span>
+                </button>
+                <div class="notifyMe__main" data-content-expand="notifyme">
+                    <form class="form notifyMe__form" data-qa="notifyMeForm">
+                        <div class="field">
+                            <div class="field__inner">
+
+
+                                <div class="field__wrap ">
+                                    <label class="field__label" for="email">Email *</label>
+                                    <input class="field__input" id="email" type="email">
+                                </div>
+
+                            </div>
+                        </div>
+                        <div class="field">
+                            <div class="field__inner">
+                                <div class="field__wrap checkboxes">
+
+
+                                    <div class="checkbox ">
+                                        <label class="checkbox__label" for="checkoutTerms">
+                                            <input class="checkbox__input" type="checkbox" id="checkoutTerms"
+                                                name="checkoutTerms">
+                                            <span class="checkbox__icon icon"></span>
+                                            Έχω διαβάσει και αποδέχομαι τους <a href="Product Detail.html#">Όρους
+                                                Χρήσης</a> &amp; την Πολιτική Απορρήτου.
+
+                                        </label>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="field">
+                            <button data-qa="form_submit" class="button widthAuto" type="submit">Subscribe</button>
+                        </div>
+                    </form>
+                    <div class="statusMessage statusMessage--success">You are now subscribed</div>
+                </div>
+            </div>
+            <button class="fav iconButton icon-heart"></button>
+        </div>
+        <p>Διαβάστε περισσότερα για τους τρόπους <a href="Product Detail.html#">Παράδοσης</a> &amp; τις <a
+                href="Product Detail.html#">Επιστροφές</a></p>
+
+    --- */
+?>
+
+
+        <div class="productDetails">
+            
+            <!-- more into sections -->
+            <!-- example:
+                    Ingredients
+                    Composition
+                    ConservationConditions
+                    Instructions
+                    Precautions
+                    ExtraInfo1
+                    SupplierDetails
+            -->
+
+            <!-- some section -->
+            <div class="productDetails__item expandText" data-plugin-expandtext="">      
+                <h2 class="productDetails__title">ΠΕΡΙΓΡΑΦΗ</h2>
+                <div class="productDetails__content">
+                    <div class="productDetails__contentInner expandText__main">
+                        <p>Sed porttitor lectus nibh. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet
+                            dui. Nulla quis lorem ut libero malesuada feugiat. Quisque velit nisi, pretium ut lacinia
+                            in, elementum id enim. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
+                            Praesent sapien massa, convallis a pellentesque nec, egestas non nisi.</p>
+                        <p>Sed porttitor lectus nibh. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet
+                            dui. Nulla quis lorem ut libero malesuada feugiat. Quisque velit nisi, pretium ut lacinia
+                            in, elementum id enim. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
+                            Praesent sapien massa, convallis a pellentesque nec, egestas non nisi.</p>
+                    </div>
+                    <button class="button button--link expandText__button">
+                        <span class="expandText__buttonTextMore">Διαβάστε περισσότερα</span>
+                        <span class="expandText__buttonTextLess">Διαβάστε λιγοτερα</span>
+                    </button>
+                </div>
+            </div>
+
+            <!-- some section -->
+            <div class="productDetails__item">
+                <h2 class="productDetails__title">ΧΑΡΑΚΤΗΡΙΣΤΙΚΑ</h2>
+                <div class="productDetails__content">
+                    <div class="productDetails__contentInner">
+                        <p>Curabitur aliquet quam id dui posuere blandit</p>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+    <div class="productHeader" data-plugin-productheader="">
+        <div class="product">
+            <div class="product__block">
+                <div class="product__img">
+
+
+                    <figure>
+                        <picture>
+                            <source data-srcset="/images/80x80/png/Content/media/sampleProduct.webp" type="image/webp"
+                                class="lazysrcset">
+                            <source data-srcset="/images/80x80/png/Content/media/sampleProduct.jp2" type="image/jp2"
+                                class="lazysrcset">
+
+
+                            <img data-src="/images/80x80/png/Content/media/sampleProduct.png" alt="product"
+                                class="lazy">
+                        </picture>
+                    </figure>
+                </div>
+                <div class="product__more">
+                    <span class="product__title">
+                        Title of product
+                    </span>
+                    <p class="product__desc">
+                        Quantity text here
+                    </p>
+                </div>
+            </div>
+            <div class="product__block">
+                <div class="priceContainer">
+                    <div class="priceBlock__price priceBlock__price--init">
+                        18,91 €
+                    </div>
+                    <div class="priceBlock__price">
+                        12,91 €
+                    </div>
+                </div>
+                <button class="addToCartButton button button--icon">
+                    <span class="addToCartButton__text addToCartButton__text--default">Προσθηκη στο καλαθι</span>
+                    <span class="addToCartButton__text addToCartButton__text--added">Προστεθηκε στο καλαθι</span>
+                    <span class="loader">
+                        <span class="loader__inner">
+                            <span class="loader__item loader__item--1"></span>
+                            <span class="loader__item loader__item--2"></span>
+                            <span class="loader__item loader__item--3"></span>
+                        </span>
+                    </span>
+                </button>
+            </div>
+        </div>
+    </div>
+
+</div>