Skip to content

Commit 6c8a390

Browse files
buuhuubuuhuu
committed
fix: lint
1 parent 8740e33 commit 6c8a390

File tree

11 files changed

+270
-261
lines changed

11 files changed

+270
-261
lines changed

‎.eslintignore

+5-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,5 @@
1-
helix-importer-ui
1+
helix-importer-ui
2+
node_modules
3+
blocks/configurator/bundle*
4+
scripts/slick.js
5+
templates/index_files

‎blocks/carousel/carousel.css

+23-17
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
/* stylelint-disable no-descending-specificity */
2+
/* stylelint-disable font-family-no-missing-generic-family-keyword */
13
main .carousel-container {
24
margin: 60px 0;
35
padding: 0;
@@ -12,8 +14,9 @@ main .carousel {
1214
scroll-snap-type: x mandatory;
1315
overflow-x: scroll;
1416
scroll-behavior: smooth;
15-
/* max-width: 1680px; */
1617
margin: auto;
18+
19+
/* max-width: 1680px; */
1720
}
1821

1922
main .carousel picture {
@@ -32,8 +35,8 @@ main .carousel img {
3235
height: 100%;
3336
object-position: 90%;
3437
}
35-
36-
main .carousel > div {
38+
39+
main .carousel>div {
3740
width: 100%;
3841
flex-shrink: 0;
3942
scroll-snap-align: start;
@@ -46,12 +49,13 @@ main .carousel > div {
4649
main .carousel div.carousel-text {
4750
max-width: 1200px;
4851
margin: 0 auto;
49-
/* background-color: white; */
50-
font-family: Playfair Display, times;
52+
font-family: 'Playfair Display', times;
5153
font-size: 35px;
5254
font-style: italic;
5355
min-height: 80px;
5456
padding: 0 28px;
57+
58+
/* background-color: white; */
5559
}
5660

5761
main .carousel div.carousel-text p {
@@ -61,17 +65,17 @@ main .carousel div.carousel-text p {
6165

6266
main .carousel div.carousel-text h2 {
6367
margin: 0;
64-
margin-top: 16px;
68+
margin-top: 16px;
6569
}
6670

6771
main .carousel div.carousel-text .button {
6872
margin: 0;
6973
}
70-
74+
7175

7276
main .carousel::-webkit-scrollbar {
73-
display: none;
74-
}
77+
display: none;
78+
}
7579

7680
main .carousel-wrapper {
7781
max-width: 1250px;
@@ -120,11 +124,13 @@ main .carousel-buttons button.selected {
120124
position: relative;
121125
}
122126

123-
.configurable-carousel > .product-item {
124-
/* flex: 0 0 auto; */
127+
.configurable-carousel>.product-item {
125128
display: inline-block;
126-
/* padding-right: 23px; */
127129
list-style: none;
130+
131+
/* padding-right: 23px; */
132+
133+
/* flex: 0 0 auto; */
128134
}
129135

130136
.configurable-carousel .product-item {
@@ -142,7 +148,7 @@ main .carousel-buttons button.selected {
142148

143149
.configurable-carousel .product-item-photo {
144150
display: block;
145-
background-color: #ffffff;
151+
background-color: #fff;
146152
}
147153

148154
.configurable-carousel .product-item-link {
@@ -168,7 +174,7 @@ main .carousel-buttons button.selected {
168174
}
169175

170176
.configurable-carousel .product-sub-title {
171-
color: #56585a;
177+
color: #56585a;
172178
text-align: left;
173179
font-size: 14px;
174180
}
@@ -185,15 +191,15 @@ main .carousel-buttons button.selected {
185191
cursor: pointer;
186192
}
187193

188-
.carousel-wrapper .carousel-arrow:before {
194+
.carousel-wrapper .carousel-arrow::before {
189195
font-family: luma-icons;
190196
display: block;
191197
justify-content: center;
192198
align-items: center;
193199
height: 100%;
194200
font-size: 18px;
195201
color: #fff;
196-
content: url("data:image/svg+xml;utf8,<svg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' version='1.1' x='0px' y='0px' viewBox='0 0 100 125'><g transform='translate(0,-952.36218)'><path style='text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:white;enable-background:accumulate;' d='m 62.097008,1002.081 a 3.0003,3.0003 0 0 0 -0.7188,-1.6563 l -18.00002,-21.00001 a 3.0003,3.0003 0 1 0 -4.5312,3.875 l 16.34372,19.06251 -16.34372,19.0625 a 3.0003,3.0003 0 1 0 4.5312,3.875 l 18.00002,-21 a 3.0003,3.0003 0 0 0 0.7188,-2.2187 z' fill='white' fill-opacity='1' marker='none' visibility='visible' display='inline' overflow='visible'/></g></svg>");
202+
content: url("data:image/svg+xml;utf8,<svg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' version='1.1' x='0px' y='0px' viewBox='0 0 100 125'><g transform='translate(0,-952.36218)'><path style='text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:white;enable-background:accumulate;' d='m 62.097008,1002.081 a 3.0003,3.0003 0 0 0 -0.7188,-1.6563 l -18.00002,-21.00001 a 3.0003,3.0003 0 1 0 -4.5312,3.875 l 16.34372,19.06251 -16.34372,19.0625 a 3.0003,3.0003 0 1 0 4.5312,3.875 l 18.00002,-21 a 3.0003,3.0003 0 0 0 0.7188,-2.2187 z' fill='white' fill-opacity='1' marker='none' visibility='visible' display='inline' overflow='visible'/></g></svg>");
197203
padding: 0;
198204

199205
}
@@ -202,7 +208,7 @@ main .carousel-buttons button.selected {
202208
left: 0;
203209
}
204210

205-
.carousel-wrapper .carousel-arrow-left:before {
211+
.carousel-wrapper .carousel-arrow-left::before {
206212
transform: rotate(180deg);
207213
}
208214

‎blocks/carousel/carousel.js

+11-15
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
1-
import { readBlockConfig } from '../../scripts/lib-franklin.js';
21
import { fetchGraphQL } from '../../scripts/scripts.js';
32

43
export default function decorate(block) {
5-
if(block.classList.contains('products')) {
6-
7-
const config = readBlockConfig(block);
4+
if (block.classList.contains('products')) {
85
const query = `
96
{
107
products(filter: { sku: { in: ["6Seats8Sides_760", "8Seats10Sides_760", "5Seats5Sides_760", "10Seats12Sides_760", "7Seats8Sides_760"] } }) {
@@ -40,15 +37,15 @@ export default function decorate(block) {
4037
if (resp.ok) {
4138
const respJson = await resp.json();
4239
const productItems = respJson.data.products.items;
43-
40+
4441
if (productItems) {
45-
const baseUrl = "https://staging.lovesac.com/";
42+
const baseUrl = 'https://staging.lovesac.com/';
4643
const carouselEl = document.createElement('ol');
4744

4845
carouselEl.classList.add('product-items', 'configurable-carousel', 'products-grid', 'glide__slides');
4946
block.innerHTML = '';
5047
block.append(carouselEl);
51-
48+
5249
productItems.forEach((product) => {
5350
// Use insertAdjacentHTML to add the template to the carousel element
5451
carouselEl.insertAdjacentHTML('beforeend', `
@@ -87,18 +84,18 @@ export default function decorate(block) {
8784

8885
buttonRight.addEventListener('click', () => {
8986
const productItem = block.querySelector('.product-item');
90-
let itemWidth = productItem.offsetWidth - block.querySelector('.configurable-carousel').offsetLeft;
91-
block.scrollTo({left: itemWidth + block.scrollLeft, behavior: 'smooth'});
87+
const itemWidth = productItem.offsetWidth - block.querySelector('.configurable-carousel').offsetLeft;
88+
block.scrollTo({ left: itemWidth + block.scrollLeft, behavior: 'smooth' });
9289
});
9390

9491
buttonLeft.addEventListener('click', () => {
9592
const productItem = block.querySelector('.product-item');
96-
let itemWidth = productItem.offsetWidth - block.querySelector('.configurable-carousel').offsetLeft;
97-
if(block.scrollLeft !== 0){
98-
if(block.scrollLeft <= itemWidth){
99-
block.scrollTo({left: 0, behavior: 'smooth'});
93+
const itemWidth = productItem.offsetWidth - block.querySelector('.configurable-carousel').offsetLeft;
94+
if (block.scrollLeft !== 0) {
95+
if (block.scrollLeft <= itemWidth) {
96+
block.scrollTo({ left: 0, behavior: 'smooth' });
10097
} else {
101-
block.scrollTo({left: block.scrollLeft - itemWidth, behavior: 'smooth'});
98+
block.scrollTo({ left: block.scrollLeft - itemWidth, behavior: 'smooth' });
10299
}
103100
}
104101
});
@@ -109,7 +106,6 @@ export default function decorate(block) {
109106
return;
110107
}
111108

112-
113109
const buttons = document.createElement('div');
114110
buttons.className = 'carousel-buttons';
115111
[...block.children].forEach((row, i) => {

‎blocks/configurator/configurator.css

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/* stylelint-disable no-empty-source */

‎blocks/configurator/configurator.js

+45-48
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,50 @@
11
function createAndAppendLink(href, media, onload) {
2-
// Create a <link> element
3-
const linkElement = document.createElement('link');
4-
5-
// Set its attributes
6-
linkElement.rel = 'stylesheet';
7-
linkElement.media = media;
8-
linkElement.href = href;
9-
10-
// Add an onload event handler if specified
11-
if (onload) {
12-
linkElement.onload = function() {
13-
this.onload = null;
14-
this.media = media;
15-
};
16-
}
17-
18-
// Append it to the <head> element
19-
document.head.appendChild(linkElement);
2+
// Create a <link> element
3+
const linkElement = document.createElement('link');
4+
5+
// Set its attributes
6+
linkElement.rel = 'stylesheet';
7+
linkElement.media = media;
8+
linkElement.href = href;
9+
10+
// Add an onload event handler if specified
11+
if (onload) {
12+
linkElement.onload = () => {
13+
this.onload = null;
14+
this.media = media;
15+
};
16+
}
17+
18+
// Append it to the <head> element
19+
document.head.appendChild(linkElement);
2020
}
2121

2222
export default function decorate(block) {
23-
const app = document.createElement("div");
24-
const script = document.createElement("script");
25-
26-
app.id = "app";
27-
script.src = `${window.hlx.codeBasePath}/blocks/configurator/bundle.2ef5f.js`;
28-
29-
block.innerHTML = "";
30-
app.appendChild(script);
31-
block.appendChild(app);
32-
33-
createAndAppendLink(
34-
'https://www.lovesac.com/static/version1676459308/frontend/BlueAcorn/site/en_US/css/styles-m.css',
35-
'all',
36-
true
37-
);
38-
39-
createAndAppendLink(
40-
'https://www.lovesac.com/static/version1676459308/frontend/BlueAcorn/site/en_US/css/styles-l.css',
41-
'screen and (min-width: 768px)',
42-
true
43-
);
44-
45-
createAndAppendLink(
46-
'https://use.typekit.net/pee8cij.css',
47-
'all',
48-
true
49-
);
50-
51-
console.log('loaded');
23+
const app = document.createElement('div');
24+
const script = document.createElement('script');
25+
26+
app.id = 'app';
27+
script.src = `${window.hlx.codeBasePath}/blocks/configurator/bundle.2ef5f.js`;
28+
29+
block.innerHTML = '';
30+
app.appendChild(script);
31+
block.appendChild(app);
32+
33+
createAndAppendLink(
34+
'https://www.lovesac.com/static/version1676459308/frontend/BlueAcorn/site/en_US/css/styles-m.css',
35+
'all',
36+
true,
37+
);
38+
39+
createAndAppendLink(
40+
'https://www.lovesac.com/static/version1676459308/frontend/BlueAcorn/site/en_US/css/styles-l.css',
41+
'screen and (min-width: 768px)',
42+
true,
43+
);
44+
45+
createAndAppendLink(
46+
'https://use.typekit.net/pee8cij.css',
47+
'all',
48+
true,
49+
);
5250
}
53-

0 commit comments

Comments
 (0)