GrooLx/https-pusat2-com-tr-index-php

1class CustomFooter extends HTMLElement {2  connectedCallback() {3    this.attachShadow({ mode: 'open' });4    this.shadowRoot.innerHTML = `5      <style>6        footer {7          background: linear-gradient(135deg, #1f2937 0%, #111827 100%);8          border-top: 1px solid #374151;9          padding: 3rem 2rem 2rem;10          margin-top: 4rem;11        }12        .footer-container {13          max-width: 1280px;14          margin: 0 auto;15        }16        .footer-content {17          display: grid;18          grid-template-columns: 2fr 1fr 1fr 1fr;19          gap: 2rem;20          margin-bottom: 2rem;21        }22        .footer-section h3 {23          color: #8b5cf6;24          font-size: 1.25rem;25          font-weight: 600;26          margin-bottom: 1rem;27        }28        .footer-logo {29          height: 60px;30          margin-bottom: 1rem;31          filter: brightness(0) invert(1);32        }33        .footer-description {34          color: #9ca3af;35          line-height: 1.6;36          margin-bottom: 1rem;37        }38        .footer-links {39          list-style: none;40          padding: 0;41          margin: 0;42        }43        .footer-links li {44          margin-bottom: 0.5rem;45        }46        .footer-links a {47          color: #d1d5db;48          text-decoration: none;49          transition: all 0.2s;50          display: inline-flex;51          align-items: center;52          gap: 0.5rem;53        }54        .footer-links a:hover {55          color: #8b5cf6;56          transform: translateX(3px);57        }58        .social-links {59          display: flex;60          gap: 1rem;61          margin-top: 1rem;62        }63        .social-link {64          width: 40px;65          height: 40px;66          border-radius: 50%;67          background: rgba(139, 92, 246, 0.1);68          display: flex;69          align-items: center;70          justify-content: center;71          transition: all 0.3s;72        }73        .social-link:hover {74          background: #8b5cf6;75          transform: translateY(-3px);76        }77        .footer-bottom {78          border-top: 1px solid #374151;79          padding-top: 2rem;80          text-align: center;81          color: #6b7280;82        }83        .footer-bottom p {84          margin: 0;85        }86        .discord-banner {87          margin-top: 1rem;88          border-radius: 0.5rem;89          overflow: hidden;90        }91        .discord-banner img {92          width: 100%;93          height: auto;94        }95        @media (max-width: 768px) {96          .footer-content {97            grid-template-columns: 1fr;98            gap: 2rem;99          }100        }101      </style>102      <footer>103        <div class="footer-container">104          <div class="footer-content">105            <div class="footer-section">106              <img src="https://pusat2.com.tr/assets/images/logo.png" alt="Pusat2" class="footer-logo">107              <p class="footer-description">108                Pusat2 Prime - 104-105 WS'lik sunucu ile epic maceralara hazır ol! 109                Türkiye'nin en kaliteli MMORPG deneyimi burada.110              </p>111              <div class="social-links">112                <a href="https://www.facebook.com/profile.php?id=61556350785511" class="social-link">113                  <i data-feather="facebook" style="color: white;"></i>114                </a>115                <a href="https://pusat2.com.tr/index.php" class="social-link">116                  <i data-feather="message-circle" style="color: white;"></i>117                </a>118              </div>119            </div>120            121            <div class="footer-section">122              <h3>Hızlı Linkler</h3>123              <ul class="footer-links">124                <li><a href="index.html"><i data-feather="home" style="width: 16px; height: 16px;"></i> Ana Sayfa</a></li>125                <li><a href="register.html"><i data-feather="user-plus" style="width: 16px; height: 16px;"></i> Kayıt Ol</a></li>126                <li><a href="download.html"><i data-feather="download" style="width: 16px; height: 16px;"></i> İndir</a></li>127                <li><a href="login.html"><i data-feather="key" style="width: 16px; height: 16px;"></i> Giriş Yap</a></li>128</ul>129            </div>130            131            <div class="footer-section">132              <h3>Sıralamalar</h3>133              <ul class="footer-links">134                <li><a href="ranking.html"><i data-feather="user" style="width: 16px; height: 16px;"></i> Sıralamalar</a></li>135</ul>136            </div>137            138            <div class="footer-section">139              <h3>Destek</h3>140              <ul class="footer-links">141                <li><a href="#" onclick="document.getElementById('membershipModal').classList.remove('hidden')"><i data-feather="file-text" style="width: 16px; height: 16px;"></i> Üyelik Sözleşmesi</a></li>142                <li><a href="support.html"><i data-feather="help-circle" style="width: 16px; height: 16px;"></i> Destek Sistemi</a></li>143</ul>144              <div class="discord-banner">145                <a href="https://pusat2.com.tr/index.php">146                  <img src="https://discordapp.com/api/guilds/pusat2/embed.png?style=banner1" alt="Discord">147                </a>148              </div>149            </div>150          </div>151          152          <div class="footer-bottom">153            <p>Pusat2 | SINCE 2018 © | PusatGAMES | PusatGames güvencesiyle zirveye taşınıyor.</p>154          </div>155        </div>156      </footer>157    `;158  }159}160 161customElements.define('custom-footer', CustomFooter);