Spaces:
Sleeping
Sleeping
Update static/script.js
Browse files- static/script.js +10 -6
static/script.js
CHANGED
@@ -260,6 +260,9 @@ function showDescriptionPopup(item) {
|
|
260 |
desc.textContent = item.description;
|
261 |
content.appendChild(desc);
|
262 |
|
|
|
|
|
|
|
263 |
const addButton = document.createElement('button');
|
264 |
addButton.textContent = 'Add';
|
265 |
addButton.className = 'popup-add-button';
|
@@ -278,14 +281,15 @@ function showDescriptionPopup(item) {
|
|
278 |
}
|
279 |
popup.remove();
|
280 |
};
|
281 |
-
|
282 |
|
283 |
const closeButton = document.createElement('button');
|
284 |
closeButton.textContent = 'Close';
|
285 |
closeButton.className = 'popup-close-button';
|
286 |
closeButton.onclick = () => popup.remove();
|
287 |
-
|
288 |
|
|
|
289 |
popup.appendChild(content);
|
290 |
document.body.appendChild(popup);
|
291 |
}
|
@@ -298,21 +302,21 @@ function displayItemsList(items, containerId, isSectorDetail = false) {
|
|
298 |
return;
|
299 |
}
|
300 |
container.innerHTML = '';
|
|
|
301 |
|
302 |
items.forEach(item => {
|
303 |
const itemDiv = document.createElement('div');
|
304 |
-
itemDiv.className =
|
305 |
|
306 |
const img = document.createElement('img');
|
307 |
img.src = item.image_url || 'https://via.placeholder.com/60';
|
308 |
img.alt = item.name;
|
|
|
309 |
itemDiv.appendChild(img);
|
310 |
|
311 |
const nameDiv = document.createElement('div');
|
312 |
nameDiv.textContent = item.name;
|
313 |
-
nameDiv.
|
314 |
-
nameDiv.style.marginTop = '5px';
|
315 |
-
nameDiv.style.fontSize = '12px';
|
316 |
itemDiv.appendChild(nameDiv);
|
317 |
|
318 |
if (isSectorDetail && item.description) {
|
|
|
260 |
desc.textContent = item.description;
|
261 |
content.appendChild(desc);
|
262 |
|
263 |
+
const buttonContainer = document.createElement('div');
|
264 |
+
buttonContainer.className = 'button-container';
|
265 |
+
|
266 |
const addButton = document.createElement('button');
|
267 |
addButton.textContent = 'Add';
|
268 |
addButton.className = 'popup-add-button';
|
|
|
281 |
}
|
282 |
popup.remove();
|
283 |
};
|
284 |
+
buttonContainer.appendChild(addButton);
|
285 |
|
286 |
const closeButton = document.createElement('button');
|
287 |
closeButton.textContent = 'Close';
|
288 |
closeButton.className = 'popup-close-button';
|
289 |
closeButton.onclick = () => popup.remove();
|
290 |
+
buttonContainer.appendChild(closeButton);
|
291 |
|
292 |
+
content.appendChild(buttonContainer);
|
293 |
popup.appendChild(content);
|
294 |
document.body.appendChild(popup);
|
295 |
}
|
|
|
302 |
return;
|
303 |
}
|
304 |
container.innerHTML = '';
|
305 |
+
container.className = 'ingredients-list'; // Ensure horizontal scroll
|
306 |
|
307 |
items.forEach(item => {
|
308 |
const itemDiv = document.createElement('div');
|
309 |
+
itemDiv.className = 'ingredient-item';
|
310 |
|
311 |
const img = document.createElement('img');
|
312 |
img.src = item.image_url || 'https://via.placeholder.com/60';
|
313 |
img.alt = item.name;
|
314 |
+
img.className = 'ingredient-image';
|
315 |
itemDiv.appendChild(img);
|
316 |
|
317 |
const nameDiv = document.createElement('div');
|
318 |
nameDiv.textContent = item.name;
|
319 |
+
nameDiv.className = 'ingredient-name';
|
|
|
|
|
320 |
itemDiv.appendChild(nameDiv);
|
321 |
|
322 |
if (isSectorDetail && item.description) {
|