const animationURLs = [ “https://cleos.co.za/wp-content/RiveLive/sale.riv”, “https://cleos.co.za/wp-content/RiveLive/boxx.riv”, “https://cleos.co.za/wp-content/RiveLive/meals_n.riv”, “https://cleos.co.za/wp-content/RiveLive/pizza_n.riv”, “https://cleos.co.za/wp-content/RiveLive/snacks_n.riv”, “https://cleos.co.za/wp-content/RiveLive/drinks.riv” ]; const animations = []; const contents = document.querySelectorAll(‘.content’); function sizeCanvas(canvas){ const dpr = window.devicePixelRatio || 1; const rect = canvas.getBoundingClientRect(); canvas.width = Math.max(1, Math.round(rect.width * dpr)); canvas.height = Math.max(1, Math.round(rect.height * dpr)); } for (let i = 0; i { sizeCanvas(canvas); r.resizeDrawingSurfaceToCanvas(); try { r.play(); } catch(e) {} } }); } catch (e) { r = new rive.Rive({ src: animationURLs[i], canvas, autoplay: true, onLoad: () => { sizeCanvas(canvas); r.resizeDrawingSurfaceToCanvas(); } }); } animations.push({ rive: r, content, gridItem }); } window.addEventListener(‘resize’, () => { animations.forEach(({ rive }) => { const c = rive && rive.canvas; if (!c) return; sizeCanvas(c); rive.resizeDrawingSurfaceToCanvas(); }); }); animations.forEach((animation) => { const { rive, content, gridItem } = animation; rive.canvas.addEventListener(‘click’, () => { contents.forEach((c, i) => { c.classList.remove(‘active’); animations[i].gridItem.classList.remove(‘selected’); }); try { rive.reset(); rive.play(); } catch(e){} content.classList.add(‘active’); gridItem.classList.add(‘selected’); }); });

Cold Meats Dairy Desserts & Bakery Potato Products Small Bites Vegetables

• 
  Sliced Pepperoni (1 kg)

  R109.90 Add to cart
• 
  Mini Cheese Sausages (1 kg)

  R99.90 Add to cart
• 
  Shoulder Bacon (1 kg)

  R129.90 Add to cart
• 
  Streaky Bacon (200 g)

  R39.90 Add to cart
• 
  Streaky Bacon (1 kg)

  R149.90 Add to cart
• 
  Sliced Sandwich Ham (125 g)

  R19.90 Add to cart
• 
  Sliced Hickory Ham – Smoked (125 g)

  R24.90 Add to cart
• 
  Sliced Hickory Ham (125 g)

  R24.90 Add to cart

• 
  Mozzarella grated, Bandini

  R79.90 – R1,079.90Price range: R79.90 through R1,079.90

  1-kg3-kg9-kg500-g

  Select an option

  Add to cart
• 
  Butter Promotion – 2 x 500 g

  R129.90 Add to cart
• 
  Butter 500 g

  R79.90 Add to cart

• 
  Chocolate Brownie

  R39.92 – R65.90Price range: R39.92 through R65.90

  150-g400-g700-g

  Select an option

  Add to cart
• 
  Malva Pudding – Caramel Syrup

  R29.90 – R49.90Price range: R29.90 through R49.90

  150-g400-g700-g

  Select an option

  Add to cart
• 
  Malva Pudding – Vanilla & Orange Syrup

  R29.90 – R49.90Price range: R29.90 through R49.90

  150-g400-g700-g

  Select an option

  Add to cart

• 
  Smiles 1.5 kg

  R169.90 Add to cart
• 
  Steakhouse Cut Chips 750 g

  R59.90 Add to cart
• 
  Slap Chips 1 kg

  R67.90 Add to cart
• 
  Skin on Wedges 2.5 kg

  R114.90 Add to cart
• 
  Shoestring Chips 2.5 kg

  R109.90 Add to cart
• 
  Skinny Chips 1 kg

  R67.90 Add to cart
• 
  Signature Hash Brown 1.2 kg

  R117.90 Add to cart

• 
  Coxinas – Cheese & Jalapeno (380 g)

  R54.90 Add to cart
• 
  Coxinas – Chicken Fillet & Feta (380 g)

  R54.90 Add to cart
• 
  Chilli Cheese Bites (1 kg)

  R139.90 Add to cart
• 
  Camembert Bites (1 kg)

  R299.90 Add to cart

• 
  Onion Rings (1 kg)

  R79.90 Add to cart
• 
  Pumpkin Chunks 1 kg

  R43.90 Add to cart
• 
  Baby Carrots 1 kg

  R49.90 Add to cart
• 
  Chopped Spinach 1 kg

  R49.90 Add to cart
• 
  Diced Carrots 1 kg

  R36.90 Add to cart
• 
  Garden Peas 1 kg

  R49.90 Add to cart
• 
  Sliced Green Beans 1 kg

  R47.90 Add to cart
• 
  Country Mix 1 kg

  R44.90 Add to cart

(() => { const tablist = document.getElementById(‘tns-tablist’); if (!tablist) return; const tabs = Array.from(tablist.querySelectorAll(‘[role=”tab”]’)); const underline = document.getElementById(‘tns-underline’); function setSelected(tab) { tabs.forEach(t => { const selected = (t === tab); t.dataset.selected = selected ? “true” : “false”; t.setAttribute(‘aria-selected’, selected ? “true” : “false”); const panelId = t.getAttribute(‘aria-controls’); const panel = panelId ? document.getElementById(panelId) : null; if (panel) panel.setAttribute(‘aria-hidden’, selected ? “false” : “true”); }); moveUnderline(tab); } function moveUnderline(tab) { if (!underline || !tab) return; // On mobile, tablist scroll affects underline positioning const rect = tab.getBoundingClientRect(); const parentRect = tablist.getBoundingClientRect(); underline.style.width = rect.width + ‘px’; underline.style.transform = `translateX(${rect.left – parentRect.left + tablist.scrollLeft}px)`; } tabs.forEach(t => { t.addEventListener(‘click’, (e) => setSelected(e.currentTarget)); }); tablist.addEventListener(‘keydown’, (e) => { const i = tabs.findIndex(t => t.getAttribute(‘aria-selected’) === ‘true’); if (![‘ArrowRight’, ‘ArrowLeft’, ‘Home’, ‘End’].includes(e.key)) return; e.preventDefault(); let n = i; if (e.key === ‘ArrowRight’) n = (i + 1) % tabs.length; if (e.key === ‘ArrowLeft’) n = (i – 1 + tabs.length) % tabs.length; if (e.key === ‘Home’) n = 0; if (e.key === ‘End’) n = tabs.length – 1; tabs[n].focus(); setSelected(tabs[n]); }); function init() { const active = tabs.find(t => t.dataset.selected === “true”) || tabs.find(t => t.getAttribute(‘aria-selected’) === “true”) || tabs[0]; if (!active) return; setSelected(active); } window.addEventListener(‘load’, init); window.addEventListener(‘resize’, init); // If this block is injected late (AJAX / builder), run immediately too: init(); })();