آموزش گرفتن پت Guild Herald

:root { --card-bg: #1f1f2e; --glow-color-1: #00c6ff; --glow-color-2: #0072ff; --text-color: #ffffff; --accent-color: #887eff; } .custom-toc { width: 100vw; border-radius: 16px; padding: 24px; font-family: "Kalameh", sans-serif; max-width: 100%; position: relative; margin-bottom: 30px; color: var(--text-color); background: var(--card-bg); box-shadow: 0 0 30px rgba(0, 198, 255, 0.2); } .custom-toc h3 { margin-bottom: 20px; font-size: 24px; font-weight: 800; color: var(--accent-color); border-bottom: 2px solid rgba(255,255,255,0.1); padding-bottom: 10px; text-align: center; letter-spacing: 1px; } .custom-toc ul { font-family: Kalameh; list-style: none; padding-left: 0; display: grid; gap: 12px; } .custom-toc li { margin: 0; padding: 0; border-left: 4px solid var(--accent-color); background: rgba(255,255,255,0.05); border-radius: 6px; transition: transform 0.2s ease; } .custom-toc li:hover { transform: scale(1.02); } .custom-toc li a { display: block; font-family: "Kalameh", sans-serif; padding: 10px 14px; color: var(--text-color); font-weight: 600; text-decoration: none; transition: all 0.3s ease; } .custom-toc li a:hover { color: var(--accent-color); padding-left: 18px; } document.addEventListener("DOMContentLoaded", function() { const tocContainer = document.getElementById("custom-toc-list"); const headings = document.querySelectorAll("h2"); headings.forEach((heading, index) => { const id = heading.id || `toc-heading-${index}`; heading.id = id; const li = document.createElement("li"); const a = document.createElement("a"); a.href = `#${id}`; a.textContent = heading.textContent; li.appendChild(a); tocContainer.appendChild(li); }); // اسکرول با آفست ۱۲۰ پیکسل هنگام کلیک document.querySelectorAll('#custom-toc-list a').forEach(link => { link.addEventListener('click', function(e) { e.preventDefault(); const targetId = this.getAttribute('href').substring(1); const targetEl = document.getElementById(targetId); if (targetEl) { const yOffset = -120; const y = targetEl.getBoundingClientRect().top + window.pageYOffset + yOffset; window.scrollTo({ top: y, behavior: 'smooth' }); } }); }); });