Save

themes/classic/assets/css/custom.scss

@@ -840,6 +840,21 @@ body#product {
 							// 		}
 							// 	}
 							// }
+
+							.fabric-colors {
+								display: flex;
+								flex-direction: row;
+								align-items: center;
+								gap: 9px;
+
+								a {
+									color: #462d26;
+									font-size: 14px;
+									font-weight: 400;
+									font-family: $fInter;
+									text-decoration: underline;
+								}
+							}
 						}
 					}
 
@@ -1085,6 +1100,52 @@ body#product {
 						}
 					}
 				}
+
+				.product-customization {
+					> .card {
+						padding: 24px;
+						background: #ece9e2;
+
+						p {
+							color: #462d26;
+							font-size: 14px;
+							font-family: $fInter;
+						}
+
+						ul {
+							margin-bottom: 0;
+						}
+
+						textarea {
+							display: flex;
+							flex-direction: row;
+							flex-wrap: nowrap;
+							align-items: center;
+							float: none;
+							border: 1px solid rgba(70, 45, 38, 0.8509803922);
+							border-radius: 1px;
+							font-size: 14px;
+							font-family: 'Inter', sans-serif;
+							font-weight: 500;
+							background: rgba(0, 0, 0, 0);
+							height: 44px;
+							outline: none;
+						}
+
+						button.btn {
+							background: #e79332;
+							margin: 0;
+							width: 100%;
+							color: #f9f7f2;
+							font-size: 14px;
+							font-weight: 500;
+							font-family: $fInter;
+							text-transform: initial;
+							padding: 10px;
+							line-height: 1.5;
+						}
+					}
+				}
 			}
 		}
 	}
@@ -2818,7 +2879,8 @@ body#category {
 						align-items: center;
 						background: #ece9e2;
 						border-radius: 50px;
-						padding: 8px 24px 8px 10px;
+						padding: 8px 24px 8px 24px;
+						height: 100%;
 
 						.subcategory-image {
 							width: 43px;
@@ -2826,6 +2888,7 @@ body#category {
 							padding: 0;
 							background: #ffffff;
 							border-radius: 100%;
+							margin-left: -16px;
 
 							img {
 								width: 100%;
@@ -3393,6 +3456,10 @@ body#authentication {
 			color: #462d26;
 			cursor: pointer;
 			margin-bottom: 0;
+
+			display: flex;
+			align-items: center;
+			column-gap: 5px;
 		}
 
 		.js-search-filters-clear-all {

themes/classic/templates/catalog/_partials/product-variants.tpl

@@ -40,9 +40,9 @@
             </span>
 
             {if $id_attribute_group == 11}
-              <div>
+              <div class="fabric-colors">
                 <img src="/img/cms/icons/colors.svg" alt="">
-                <a href="#">Zobacz dostępne tkaniny tutaj</a>
+                <a href="/content/8-dostepne-tkaniny">Zobacz dostępne tkaniny tutaj</a>
               </div>
             {/if}
 

themes/classic/templates/catalog/product.tpl

@@ -102,11 +102,7 @@
                   {include file='catalog/_partials/product-variants.tpl'}
                 {/block}
 
-                {if $product.is_customizable && count($product.customizations.fields)}
-                  {block name='product_customization'}
-                    {include file="catalog/_partials/product-customization.tpl" customizations=$product.customizations}
-                  {/block}
-                {/if}
+                
                 
                 {block name='product_pack'}
                   {if $packItems}
@@ -139,6 +135,12 @@
             {/block}
           </div>
 
+          {if $product.is_customizable && count($product.customizations.fields)}
+            {block name='product_customization'}
+              {include file="catalog/_partials/product-customization.tpl" customizations=$product.customizations}
+            {/block}
+          {/if}
+
           <ol id="description-nav">
             {if $product.description}
               <li class="nav-item">