pairTape.html•1.36 kB
<div class="w-full animate__animated animate__fadeInDown">
<div class="tradingview-widget-container" id="ticker-tape-container">
<div class="tradingview-widget-container__widget"></div>
</div>
</div>
<script>
function renderTickerTapeWidget() {
const theme = document.documentElement.classList.contains("dark") ? "dark" : "light";
const container = document.getElementById("ticker-tape-container");
container.innerHTML = '<div class="tradingview-widget-container__widget"></div>'; // reset content
const script = document.createElement("script");
script.type = "text/javascript";
script.src = "https://s3.tradingview.com/external-embedding/embed-widget-ticker-tape.js";
script.async = true;
script.innerHTML = JSON.stringify({
symbols: [
{ description: "", proName: "{{ .Pair.BaseAsset.Symbol }}" },
{ description: "", proName: "{{ .Pair.QuoteAsset.Symbol }}" }
],
showSymbolLogo: true,
colorTheme: theme,
isTransparent: true,
displayMode: "adaptive",
locale: "en"
});
container.appendChild(script);
}
renderTickerTapeWidget();
// Optional: Re-render on theme change
const observer = new MutationObserver(renderTickerTapeWidget);
observer.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
</script>