'; document.body.appendChild(bar); const btn = bar.querySelector("#csmax-sb-btn"); if (btn) { btn.addEventListener("click", function() { const realBtns = document.querySelectorAll('button[type="button"]'); for (let i = 0; i < realBtns.length; i++) { const b = realBtns[i]; if (b.id === "csmax-sb-btn") continue; if ((b.textContent || "").trim() === "\u52A0\u5165\u8CFC\u7269\u8ECA") { b.click(); return; } } }); } return bar; } function adjustForCartWidget(bar) { const widget = document.querySelector(".zb-cart-widget-btn"); const widgetHidden = !widget || window.getComputedStyle(widget).display === "none"; if (widgetHidden) { bar.style.paddingLeft = "16px"; bar.style.paddingRight = "16px"; return; } const pos = widget.getAttribute("data-position") || "bottom-left"; if (pos === "bottom-right") { bar.style.paddingLeft = "16px"; bar.style.paddingRight = "84px"; } else { bar.style.paddingLeft = "84px"; bar.style.paddingRight = "16px"; } } function showStickyBar(label, price) { const bar = ensureStickyBar(); if (!bar) return; const labelEl = bar.querySelector("#csmax-sb-label"); const priceEl = bar.querySelector("#csmax-sb-price"); if (labelEl) labelEl.textContent = label; if (priceEl && price !== null) priceEl.textContent = price; adjustForCartWidget(bar); if (!bar.classList.contains("csmax-sb-on")) bar.classList.add("csmax-sb-on"); if (!document.body.classList.contains("csmax-has-sticky-bar")) document.body.classList.add("csmax-has-sticky-bar"); } function hideStickyBar() { const bar = document.getElementById("csmax-sticky-cart-bar"); if (bar) bar.classList.remove("csmax-sb-on"); document.body.classList.remove("csmax-has-sticky-bar"); } function findActiveVariant() { if (variants.length === 0 || optionValueSet.size === 0) return null; const active = /* @__PURE__ */ new Set(); const btns = document.querySelectorAll('button[type="button"]'); for (let i = 0; i < btns.length; i++) { const btn = btns[i]; const txt = (btn.textContent || "").trim(); if (!optionValueSet.has(txt)) continue; const st = btn.getAttribute("style") || ""; if (/background:\s*var\(--st-fg/.test(st)) active.add(txt); } for (let i = 0; i < variants.length; i++) { const v = variants[i]; const opts = []; if (v.option1) opts.push(v.option1); if (v.option2) opts.push(v.option2); if (v.option3) opts.push(v.option3); if (opts.length === 0) continue; let allMatch = true; for (let j = 0; j < opts.length; j++) { if (!active.has(opts[j])) { allMatch = false; break; } } if (allMatch) return v; } return null; } function paintActive() { if (!currentHandle) return; const span = findPriceSpan(); if (variants.length > 0) { const v = findActiveVariant(); if (!v) return; const priceN = Number(v.priceOverride ?? v.price); if (!Number.isFinite(priceN) || priceN <= 0) return; const target = formatTwd(priceN); if (span && span.textContent !== target) span.textContent = target; const parts = []; if (v.option1) parts.push(v.option1); if (v.option2) parts.push(v.option2); if (v.option3) parts.push(v.option3); showStickyBar(parts.length > 0 ? "\u5DF2\u9078 " + parts.join(" / ") : "", target); return; } if (span) { const txt = (span.textContent || "").trim(); if (txt) showStickyBar("", txt); } } function schedulePaint() { if (pendingTimer) clearTimeout(pendingTimer); pendingTimer = setTimeout(paintActive, 30); } function setup() { const path = window.location.pathname.replace(/^\/[a-z]{2}(?=\/|$)/, ""); const m = path.match(/^\/shop\/([^/]+)$/); if (!m) { currentHandle = null; variants = []; optionValueSet = /* @__PURE__ */ new Set(); hideStickyBar(); return; } const handle = m[1]; if (handle === currentHandle && variants.length > 0) { schedulePaint(); return; } currentHandle = handle; fetch("/v1/commerce/storefront/products/by-handle/" + encodeURIComponent(handle)).then(function(r) { return r.ok ? r.json() : null; }).then(function(prod) { if (!prod || !prod.variants || prod.variants.length < 2) return; const newVariants = []; for (let i = 0; i < prod.variants.length; i++) { const v = prod.variants[i]; if (v && v.isActive !== false) newVariants.push(v); } const newOptSet = /* @__PURE__ */ new Set(); if (prod.options) { for (let i = 0; i < prod.options.length; i++) { const vals = prod.options[i] ? prod.options[i].values : null; if (vals && Array.isArray(vals)) { for (let j = 0; j < vals.length; j++) { if (vals[j]) newOptSet.add(vals[j]); } } } } if (newOptSet.size === 0) { for (let i = 0; i < newVariants.length; i++) { const v = newVariants[i]; if (v.option1) newOptSet.add(v.option1); if (v.option2) newOptSet.add(v.option2); if (v.option3) newOptSet.add(v.option3); } } variants = newVariants; optionValueSet = newOptSet; schedulePaint(); }).catch(function() { }); } setup(); const origPush = history.pushState.bind(history); history.pushState = function(...args) { origPush(...args); setTimeout(setup, 100); }; const origReplace = history.replaceState.bind(history); history.replaceState = function(...args) { origReplace(...args); setTimeout(setup, 100); }; function onPop() { setTimeout(setup, 100); } window.addEventListener("popstate", onPop); const mo = new MutationObserver(schedulePaint); function startObserve() { if (document.body) { mo.observe(document.body, { attributes: true, attributeFilter: ["style"], childList: true, subtree: true }); } } startObserve(); return function() { if (pendingTimer) clearTimeout(pendingTimer); mo.disconnect(); window.removeEventListener("popstate", onPop); history.pushState = origPush; history.replaceState = origReplace; }; }, []); (0, import_react.useEffect)(() => { if (typeof window === "undefined") return; const reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches; if (reduce) return; const vh = window.innerHeight; const sections = document.querySelectorAll("main section, main .csmax-reveal-auto"); sections.forEach((el) => { if (el.classList.contains("csmax-reveal")) return; if (el.hasAttribute("data-csmax-reveal-skip")) return; if (el.getAttribute("data-section") === "product-full-description") return; const h = el.getBoundingClientRect().height; if (h > vh * 0.9) return; el.classList.add("csmax-reveal"); }); const targets = document.querySelectorAll(".csmax-reveal:not(.in)"); const io = new IntersectionObserver( (entries) => { entries.forEach((e) => { if (e.isIntersecting) { e.target.classList.add("in"); io.unobserve(e.target); } }); }, // threshold:0 + rootMargin 收進 12% 就觸發 — 對小元素夠柔和，對大元素也能進場 { threshold: 0, rootMargin: "0px 0px -22% 0px" } ); targets.forEach((t) => io.observe(t)); const safetyTimer = window.setTimeout(() => { if (!("IntersectionObserver" in window)) { document.querySelectorAll(".csmax-reveal:not(.in)").forEach((el) => el.classList.add("in")); return; } const vh2 = window.innerHeight; document.querySelectorAll(".csmax-reveal:not(.in)").forEach((el) => { const r = el.getBoundingClientRect(); if (r.top < vh2 * 0.85 && r.bottom > 0) el.classList.add("in"); }); }, 1500); const parallaxEls = document.querySelectorAll( ".csmax-parallax-bg, .csmax-shared-hero, .csmax-home-hero-bg" ); let rafId = 0; const onScroll = () => { if (rafId) return; rafId = window.requestAnimationFrame(() => { rafId = 0; parallaxEls.forEach((el) => { const rect = el.getBoundingClientRect(); const speed = Number(el.dataset.parallaxSpeed ?? "0.25"); const offset = Math.max(-120, Math.min(120, rect.top * speed * -0.5)); el.style.setProperty("--csmax-parallax-y", `${offset.toFixed(1)}px`); }); }); }; onScroll(); window.addEventListener("scroll", onScroll, { passive: true }); window.addEventListener("resize", onScroll, { passive: true }); return () => { io.disconnect(); window.clearTimeout(safetyTimer); window.removeEventListener("scroll", onScroll); window.removeEventListener("resize", onScroll); }; }, [pathname]); (0, import_react.useEffect)(() => { if (typeof window === "undefined") return; const isEN = /^\/en(\/|$)/.test(window.location.pathname); function isRecTitle(s) { const t = (s || "").trim(); return t.indexOf("\u63A8\u85A6\u5546\u54C1") === 0 || /recommended\s+products?/i.test(t); } function recHref(raw) { if (!isEN) return raw || "#"; if (!raw) return raw; let handle = ""; const q = raw.match(/[?&]p=([^&]+)/); if (q) { handle = decodeURIComponent(q[1]); } else { const path = raw.split("?")[0].replace(/\/+$/, ""); const seg = path.split("/").filter(Boolean); handle = seg.length ? seg[seg.length - 1] : ""; } if (!handle || handle === "product-detail") return raw; return "/en/product-detail?p=" + encodeURIComponent(handle); } function styleH2(h2) { h2.setAttribute("style", "font-size:20px;color:#5f4c3f;letter-spacing:.08em;margin:48px 0 6px;border-top:1px solid #e5e3de;padding-top:30px;"); } function buildCard(p) { const card = document.createElement("div"); card.className = "rec-card"; card.setAttribute("style", "display:flex;gap:18px;align-items:flex-start;margin:22px 0;padding:18px;background:#f5f3ef;border-radius:6px;"); const aImg = document.createElement("a"); aImg.setAttribute("href", recHref(p.href)); aImg.setAttribute("style", "flex:0 0 116px;display:block;"); const img = document.createElement("img"); img.setAttribute("src", p.img); img.setAttribute("alt", p.name); img.setAttribute("loading", "lazy"); img.setAttribute("style", "width:116px;height:116px;object-fit:cover;display:block;border-radius:4px;"); aImg.appendChild(img); const right = document.createElement("div"); right.setAttribute("style", "flex:1;min-width:0;"); const h3 = document.createElement("h3"); h3.setAttribute("style", "margin:0 0 8px;font-size:16px;font-weight:600;line-height:1.4;"); h3.textContent = p.name; const desc = document.createElement("p"); desc.setAttribute("style", "margin:0 0 10px;font-size:14px;line-height:1.7;color:#666;"); desc.textContent = p.desc; const aLink = document.createElement("a"); aLink.setAttribute("href", recHref(p.href)); aLink.setAttribute("style", "font-size:14px;color:#8b7460;text-decoration:underline;"); aLink.textContent = p.linkText || "\u7ACB\u5373\u67E5\u770B"; right.appendChild(h3); right.appendChild(desc); right.appendChild(aLink); card.appendChild(aImg); card.appendChild(right); return card; } function healOne(h2) { let firstEl = h2.nextElementSibling; while (firstEl && firstEl.tagName === "P" && !(firstEl.textContent || "").trim() && firstEl.children.length === 0) { firstEl = firstEl.nextElementSibling; } if (!firstEl) return; if (firstEl.classList && firstEl.classList.contains("rec-card")) return; if (firstEl.tagName !== "IMG") return; const products = []; const toRemove = []; let cur = null; let reminder = null; let node = h2.nextElementSibling; while (node) { const tag = node.tagName; const txt = (node.textContent || "").trim(); if (tag === "P" && (txt.indexOf("\uFF0A") === 0 || node.querySelector("em"))) { reminder = node; break; } if (tag === "IMG") { if (cur) products.push(cur); cur = { img: node.getAttribute("src") || "", name: node.getAttribute("alt") || "", desc: "", href: "#", linkText: "" }; toRemove.push(node); } else if (cur && tag === "H3") { if (txt) cur.name = txt; toRemove.push(node); } else if (cur && tag === "P") { const a = node.querySelector("a[href]"); if (a) { cur.href = a.getAttribute("href") || cur.href; cur.linkText = (a.textContent || "").trim() || cur.linkText; } else if (!cur.desc && txt) { cur.desc = txt; } toRemove.push(node); } else if (!cur && tag === "P" && !txt) { toRemove.push(node); } else { break; } node = node.nextElementSibling; } if (cur) products.push(cur); if (products.length === 0) return; styleH2(h2); const frag = document.createDocumentFragment(); for (let i = 0; i < products.length; i++) frag.appendChild(buildCard(products[i])); if (h2.parentNode) h2.parentNode.insertBefore(frag, h2.nextSibling); for (let i = 0; i < toRemove.length; i++) { const par = toRemove[i].parentNode; if (par) par.removeChild(toRemove[i]); } if (reminder) reminder.setAttribute("style", "font-size:13px;color:#999;margin-top:24px;font-style:italic;"); } function heal() { if (!/\/blog\//.test(window.location.pathname)) return; const h2s = document.querySelectorAll("main h2"); for (let i = 0; i < h2s.length; i++) { const t = (h2s[i].textContent || "").trim(); if (isRecTitle(t)) healOne(h2s[i]); } } heal(); const t1 = setTimeout(heal, 200); const t2 = setTimeout(heal, 800); return function() { clearTimeout(t1); clearTimeout(t2); }; }, [pathname]); return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: rootClassName, "data-csmax-recfix": "v2", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: ` .zb-article-body h2, .zb-article-body h3, .zb-article-body h4 { font-weight: 700; } .zb-article-body h2 strong, .zb-article-body h3 strong, .zb-article-body h4 strong { font-weight: 700; } .zb-article-body ul { list-style: disc; padding-left: 1.5em; } .zb-article-body ul li { list-style: disc; display: list-item; } ` }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("header", { className: "csmax-nav", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-nav-inner", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Wordmark, { href: lh("/") }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { className: "csmax-nav-links", children: links.map((l) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh(l.href), children: l.label }, l.href)) }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-nav-actions", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh("/account"), style: { fontSize: 16 }, children: L.account }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh("/shop/cart"), className: "csmax-icon-btn", "aria-label": L.cart, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CartIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: langUrl, className: "csmax-lang-btn", "aria-label": L.lang, children: langLabel }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "csmax-mobile-menu", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("summary", { className: "csmax-burger", "aria-label": "Menu", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-mobile-drawer", children: [ links.map((l) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh(l.href), children: l.label }, l.href)), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-drawer-actions", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", { href: lh("/account"), children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "csmax-drawer-action-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(UserIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: L.account }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { children: L.accountSub }) ] }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", { href: lh("/shop/cart"), children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "csmax-drawer-action-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CartIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: L.cart }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { children: L.cartSub }) ] }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", { href: langUrl, children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "csmax-drawer-action-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GlobeIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: L.lang }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { children: langLabel }) ] }) ] }) ] }) ] }) ] }) ] }) ] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("main", { children }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("footer", { className: "csmax-footer", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-inner", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "csmax-footer-logo", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)( "img", { src: "https://neat-tiger-98977-img-cdn.b-cdn.net/assets/themes/csmax/logo-wordmark-white.png", alt: "C'smax \u4ED9\u745F\u570B\u969B", style: { height: 48, width: "auto", display: "block" } } ) }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-contact", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ F.contactEmailLabel, "\uFF1A", contactEmail ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ F.partnerEmailLabel, "\uFF1A", partnerEmail ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ F.contactPhoneLabel, "\uFF1A", contactPhone ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [ F.hoursLabel, "\uFF1A", F.hoursValue ] }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-socials", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: "https://line.me/R/ti/p/@wjg8049w", "aria-label": "LINE", target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LineIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: "https://www.facebook.com/CensilCsmax/?locale=zh_TW", "aria-label": "Facebook", target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FbIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: "https://www.instagram.com/censilcsmax/", "aria-label": "Instagram", target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IgIcon, {}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: "https://www.youtube.com/@censilbiochemicalinc.1793", "aria-label": "YouTube", target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31 31 0 0 0 0 12a31 31 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31 31 0 0 0 24 12a31 31 0 0 0-.5-5.8ZM9.6 15.6V8.4l6.3 3.6-6.3 3.6Z" }) }) }) ] }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-col", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { children: F.col1Title }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: F.col1Items.map(([label, href]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh(href), children: label }) }, href)) }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-col", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { children: F.col2Title }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: F.col2Items.map(([label, href]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh(href), children: label }) }, href)) }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "csmax-footer-col", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { children: F.col3Title }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: F.col3Items.map(([label, href]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: lh(href), children: label }) }, href)) }) ] }) ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "csmax-footer-copyright", children: copyright }) ] }) ] }); } // ../web/components/themes/csmax-private-bec67bcc/index.tsx var meta = { id: "csmax", name: "C'smax \u4ED9\u745F\u570B\u969B", description: "\u6696\u68D5 \xD7 \u5976\u6CB9\u7C73 \xD7 \u91D1\u8272\u9EDE\u7DB4\u7684\u5962\u83EF\u4FDD\u990A\u54C1\u724C\u4E3B\u984C" }; var theme = { meta, Chrome: CsmaxChrome }; var index_default = theme;