/* custom scroll */ ::-webkit-scrollbar width: 8px; ::-webkit-scrollbar-track background: #14181f; ::-webkit-scrollbar-thumb background: #4f46e5; border-radius: 12px;
function renderMembers() const container = document.getElementById('membersContainer'); if (!container) return; container.innerHTML = membersData.map(member => ` <div class="member-card"> <div class="member-avatar"><i class="$member.avatarIcon"></i></div> <div class="member-name">$member.name</div> <div class="member-role">$member.role</div> <div class="member-bio">$member.bio</div> </div> `).join(''); guild website template free
<nav class="navbar"> <div class="container nav-container"> <div class="logo"> <i class="fas fa-dragon logo-icon"></i> <h1>ÆTHELGARD</h1> </div> <ul class="nav-links"> <li><a href="#" class="active">Home</a></li> <li><a href="#about">Lore</a></li> <li><a href="#roster">Roster</a></li> <li><a href="#progress">Raids</a></li> <li><a href="#join">Join</a></li> </ul> <button class="btn-outline-light" id="discordBtn"><i class="fab fa-discord"></i> Discord</button> </div> </nav> ::-webkit-scrollbar-track background: #14181f
.container max-width: 1280px; margin: 0 auto; padding: 0 24px; ::-webkit-scrollbar-thumb background: #4f46e5
<!-- Recruitment section --> <section id="join"> <div class="container"> <div class="recruit-box"> <h3><i class="fas fa-hand-peace"></i> Join the Warband</h3> <p style="max-width: 600px; margin: 0 auto 12px;">We are recruiting dedicated players for mythic raid progression & high M+ keys.</p> <div class="recruit-tags"> <span class="tag">🔥 Tank (Prot War / DH)</span> <span class="tag">✨ Healer (Prevoker / Disc)</span> <span class="tag">⚡ Ranged DPS (Mage/Lock)</span> <span class="tag">🛡️ Melee DPS (Rogue/Ret)</span> </div> <p style="margin-bottom: 28px; font-size: 0.9rem;">Raids: Wed/Thu 8pm-11pm EST | alt-friendly & social members welcome!</p> <button class="btn-secondary" id="recruitApplyBtn"><i class="fab fa-discord"></i> Apply via Discord</button> </div> </div> </section> </main>
