Project-Pro/newwalls.pl
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change product material box

Browse Source
This commit is contained in:
Roman Pyrih
2024-12-18 13:17:54 +01:00
parent 14cafb2c59
commit 8dbdb723fd
4 changed files with 134 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
themes/ayon/assets/css/custom.css
View File

File diff suppressed because one or more lines are too long

2
themes/ayon/assets/css/custom.css.map
View File

File diff suppressed because one or more lines are too long

17
themes/ayon/assets/css/custom.scss
View File

@@ -2378,3 +2378,20 @@ body#index {
width: 30px;
}
}
.fancybox-material-box {
.material-canvas {
&:nth-child(2n + 1) {
background: #dfdfdf;
}
.col-xs-12 {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 20px;
align-items: center;
justify-content: space-between;
}
}
}

152
themes/ayon/assets/js/custom.js
View File

@@ -414,43 +414,121 @@ $(document).on('click', '.fancybox-material-controls', function() {
minWidth: 800,
maxWidth: 1000,
padding: 0,
content: '<h3 style="text-align: center; padding:10px; margin: 10px 0 20px 0;">Wybierz materiał</h3>'
+ '<div class="col-xs-12 material-canvas" style="padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/canvas-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Canvas</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="9">Wybierz (' + priceDisplay + ' PLN/m2) <i class="material-icons">chevron_right</i></button>'
+ '</div>'
+ '<div class="col-xs-12 material-sand" style="background: #dfdfdf; padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/brush-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Brush</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="17">Wybierz (' + priceDisplay + ' PLN/m2)<i class="material-icons">chevron_right</i></button>'
+ '</div>'
+ '<div class="col-xs-12 material-sand" style="padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/grain-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Grain</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="8">Wybierz (' + priceDisplay + ' PLN/m2)<i class="material-icons">chevron_right</i></button>'
+ '</div>'
+ '<div class="col-xs-12 material-sand" style="background: #dfdfdf; padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/dust-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Dust</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="15">Wybierz (' + priceDisplay + ' PLN/m2)<i class="material-icons">chevron_right</i></button>'
+ '</div>'
+ '<div class="col-xs-12 material-sand" style="padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/extrafine-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Extra Fine</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="16">Wybierz (' + priceDisplay + ' PLN/m2)<i class="material-icons">chevron_right</i></button>'
+ '</div>'
+ '<div class="col-xs-12 material-sand" style="background: #dfdfdf; padding:20px;">'
// + '<div class="col-xs-3"><img src="https://newwalls.pl/img/cms/custom-pages/struktury/grated-img.png"></div>'
+ '<div class="col-xs-12">Tapeta winylowa na fizelinie Grated</div>'
+ '<br/>'
+ '<button id="fancy-material-btn" class="btn" data-value="14">Wybierz (' + priceDisplay + ' PLN/m2)<i class="material-icons">chevron_right</i></button>'
+ '</div>'
content: `
<div class="fancybox-material-box">
<h3 style="text-align: center; padding:10px; margin: 10px 0 20px 0;">Wybierz materiał</h3>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Canvas</span>
<button id="fancy-material-btn" class="btn" data-value="9">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Concre</span>
<button id="fancy-material-btn" class="btn" data-value="19">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Craft</span>
<button id="fancy-material-btn" class="btn" data-value="20">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Extra Fine</span>
<button id="fancy-material-btn" class="btn" data-value="16">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Fibro</span>
<button id="fancy-material-btn" class="btn" data-value="21">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Linen</span>
<button id="fancy-material-btn" class="btn" data-value="22">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Novella</span>
<button id="fancy-material-btn" class="btn" data-value="23">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Ruta</span>
<button id="fancy-material-btn" class="btn" data-value="24">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Trapan</span>
<button id="fancy-material-btn" class="btn" data-value="25">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
<div class="col-xs-12 material-canvas" style="padding:20px;">
<div class="row">
<div class="col-xs-12">
<span>Tapeta winylowa na fizelinie Zebra</span>
<button id="fancy-material-btn" class="btn" data-value="26">
Wybierz (${priceDisplay} PLN/m2) <i class="material-icons">chevron_right</i>
</button>
</div>
</div>
</div>
</div>
`
});
});