Twotrees Store /* Keep logo colors stable — no invert / hover swap */ .header__heading-logo { filter: none !important; } @media(max-width: 989px) { sticky-header .header__heading-logo { max-width: 75px; } } document.addEventListener('DOMContentLoaded', function () { // 创建一个观察器实例 const observer = new MutationObserver(function(mutations) { const motherBoxes = document.querySelectorAll('.sales-box'); if (motherBoxes.length > 0) { motherBoxes.forEach(box => { const newSvg = `<svg t="1788491946255" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4842" width="24" height="24"><path d="M498.688 733.696m-285.184 0a285.184 285.184 0 1 0 570.368 0 285.184 285.184 0 1 0-570.368 0Z" fill="#FFC13B" p-id="4843"></path><path d="M135.168 626.688c6.656-28.16 24.064-72.704 51.2-134.144s42.496-111.104 45.056-149.504c26.624 49.152 41.984 98.816 46.08 148.48 100.864-125.44 153.6-271.872 157.696-438.272 6.656 4.096 15.36 9.728 25.6 17.408s30.208 23.04 59.392 46.08c29.184 23.04 54.784 48.64 75.776 75.776 20.992 27.136 41.984 59.904 62.464 98.304s32.256 78.336 34.816 120.832c10.24-24.576 16.896-51.2 19.456-79.872s-0.512-56.32-9.216-82.944c10.24 8.192 24.064 22.016 41.984 40.96 17.92 18.944 36.864 44.544 57.344 75.776 20.48 31.232 39.424 65.024 57.344 101.376 17.92 36.352 28.16 76.288 31.744 120.832 3.584 44.544 0.512 87.552-9.216 130.048-9.728 42.496-34.304 85.504-73.728 130.048s-91.648 85.504-155.648 122.88c43.52-87.552 52.224-182.272 25.6-284.672-26.624-102.4-79.36-180.736-157.696-234.496 6.656 29.184 3.072 77.312-11.264 144.384s-36.352 118.272-66.56 153.6c4.608-43.008 6.144-77.824 4.096-104.448-2.048-26.624-6.144-46.592-12.288-59.392l-10.24-18.432c-8.192 47.616-28.672 95.744-61.44 144.384-17.92 25.088-31.232 48.64-39.936 69.632-8.704 20.992-11.776 48.64-9.216 81.92 2.56 33.28 12.8 69.12 30.72 107.52-92.16-51.712-154.112-104.448-185.344-157.696-31.232-53.248-39.424-115.2-24.576-185.344v-1.024z" fill="#F87B68" p-id="4844"></path></svg>` const existingSvg = box.querySelector('svg'); if (existingSvg) { const svgWrapper = document.createElement('div'); svgWrapper.className = 'svg-wrapper'; svgWrapper.innerHTML = newSvg; existingSvg.parentNode.replaceChild(svgWrapper, existingSvg); } else { const svgWrapper = document.createElement('div'); svgWrapper.className = 'svg-wrapper'; svgWrapper.innerHTML = newSvg; box.appendChild(svgWrapper); } }); observer.disconnect(); return true; } return false; }); // 配置观察器选项 const config = { childList: true, // 观察目标子节点的变化，添加或删除 subtree: true // 观察后代节点 }; // 开始观察整个 document observer.observe(document.body, config); // bundles-box SVG 插入（同上逻辑） const observerBundles = new MutationObserver(function(mutations) { const bundlesBoxes = document.querySelectorAll('.bundles-box'); if (bundlesBoxes.length > 0) { bundlesBoxes.forEach(box => { if (box.querySelector('.svg-wrapper')) return; // 已处理过则跳过 const newSvg = `<svg t="1772439140184" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9799" width="24" height="24"><path d="M450.133333 934.4c-8.533333 0-17.066667-2.133333-23.466666-4.266667-61.866667-17.066667-381.866667-85.333333-211.2-514.133333 0 0 29.866667 96 83.2 96 12.8-202.666667 217.6-243.2 128-465.066667 0 0 238.933333 55.466667 268.8 337.066667 0 0 34.133333-89.6 102.4-98.133333 0 0-21.333333 49.066667 0 123.733333 0 0 200.533333 364.8-160 514.133333 0 0-21.333333 8.533333-46.933334 12.8 166.4-168.533333-96-341.333333-96-341.333333 10.666667 89.6-211.2 194.133333-44.8 339.2z" fill="#d81e06" p-id="9800"></path></svg>`; if (!newSvg) return; const existingSvg = box.querySelector('svg'); if (existingSvg) { const svgWrapper = document.createElement('div'); svgWrapper.className = 'svg-wrapper'; svgWrapper.innerHTML = newSvg; existingSvg.parentNode.replaceChild(svgWrapper, existingSvg); } else { const svgWrapper = document.createElement('div'); svgWrapper.className = 'svg-wrapper'; svgWrapper.innerHTML = newSvg; box.insertBefore(svgWrapper, box.firstChild); // 插入到前面 } }); observerBundles.disconnect(); } }); observerBundles.observe(document.body, config); }); document.addEventListener('DOMContentLoaded', function () { function updateLogoInvert() { // 获取 header 内的图标元素，它应该是白色的 const iconElement = document.querySelector('.header .header__icon'); if (!iconElement) { return; } // 获取计算后的实际颜色值 let computedColor = getComputedStyle(iconElement).color; // 解析RGB值 const rgbMatch = computedColor.match(/rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/); if (!rgbMatch) { return; } // 检查是否是白色或接近白色 const isLightColor = Number(rgbMatch[1]) > 200 && Number(rgbMatch[2]) > 200 && Number(rgbMatch[3]) > 200; // 获取所有 logo 元素 const logos = document.querySelectorAll('.header__heading-logo'); // 根据图标颜色设置 logo 的 invert logos.forEach((logo) => { if (isLightColor) { // 如果图标是浅色/白色，logo保持原样（假设logo本身是白色） logo.style.filter = 'none'; } else { // 如果图标是深色，logo需要反转 logo.style.filter = 'invert(1)'; } }); } // 初始执行一次 updateLogoInvert(); // 监听可能的颜色变化事件（如滚动、悬停等） document.addEventListener('scroll', updateLogoInvert); // 对于 hover 效果 const headerWrapper = document.querySelector('.header'); if (headerWrapper) { headerWrapper.addEventListener('mouseenter', () => { updateLogoInvert(); }); headerWrapper.addEventListener('mouseleave', () => { updateLogoInvert(); }); } });🔒 SSL Verified