anomaly-front-stats/templates/about_us.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>About Us - TRL Stats</title>
    <link rel="icon" type="image/x-icon" href="/trlstats/static/img/TRL_Logo_Custom.jpg"/>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"/>
</head>

<body>
<header>
    <nav>
        <button class="hamburger" aria-label="Toggle menu">
            <span class="bar"></span>
            <span class="bar"></span>
            <span class="bar"></span>
        </button>
        <div class="nav-menu">
            <a href="{{ url_for('calculator') }}">DPS/DPM CALCULATOR</a>
            <a href="{{ url_for('about_us') }}">ABOUT US</a>
            <a href="{{ url_for('suggestion') }}">SUGGESTIONS & FEEDBACK</a>
            <a href="https://www.roblox.com/games/5766084948/SCP-The-Red-Lake-EVENT">PLAY THE RED LAKE</a>
            <a href="https://discord.gg/2jDevH8aTd">OUR DISCORD</a>
        </div>
    </nav>
</header>

<main class="about_us_main">
    <h1 class="about_us_h1">About Us</h1>

    <h3 class="about_us_h3"><b>Hey there!</b> You found the TRL Stats Page by <b>Fretux</b> and <b>Losernoob124</b> 🎯</h3>

    <h2 class="about_us_h2">Our Mission</h2>
    <p class="about_us_text">
        We created this platform to help the TRL community quickly and easily calculate gun DPS and DPM — no
        spreadsheets, no hassle. Whether you're theorycrafting a Deathwish loadout or comparing your sidearms, our
        tool’s built to support your grind.
    </p>
    <p class="about_us_text">
        Got ideas or stat suggestions? Hit us up on Discord or submit feedback via our <a
            href="{{ url_for('suggestion') }}">Suggestions Page</a>.
    </p>

    <h2 class="about_us_h2">Our Story</h2>
    <p class="about_us_text">
        It started with a spreadsheet... and frustration. Calculating DPS manually was tedious — and we knew we could do
        better. What began as a side hobby by Losernoob124 was reignited by Fretux and evolved into a full web app
        through plenty of bug fixing, community help, and caffeine.
    </p>

    <h2 class="about_us_h2">The Team</h2>
    <div class="team-section">
        <div class="team-member">
            <b>Fretux</b> – Frontend Developer & Data Specialist. Designs the UI and ensures stat accuracy.
        </div>
        <div class="team-member">
            <b>Losernoob124</b> – Backend Developer. Handles everything under the hood and makes sure the calculators
            work.
        </div>
    </div>

    <h2 class="about_us_h2">Frequently Asked Questions</h2>
    <div class="faq">
        <p><b>How do you calculate DPS and DPM?</b></p>
        <p class="about_us_text">
            We use data from <a
                href="https://docs.google.com/spreadsheets/d/1hGGLMOKB5Tj3FSo38HX7WbIvOmMbgfE5ZApTSOZgnS8/edit?gid=0#gid=0"
                target="_blank">Lanz1021's Stat Sheet</a>, convert it into a JSON structure, and use it with formulas
            similar to what’s on the sheet.
        </p>

        <p><b>How often are stats updated?</b></p>
        <p class="about_us_text">
            We update our database every time TRL releases a gameplay patch or changes weapon stats.
        </p>
    </div>

    <h2 class="about_us_h2">Special Thanks 🙏</h2>
    <div class="thanks-section">
        <p><b>gameknight90999 (holdenn)</b>: Helped with various stat and weapon data and ideas</p>
        <p><b>Kris HD</b>: Motivation + bug hunting</p>
        <p><b>Lanz1021</b>: Feedback & review</p>
        <p><b>YOU</b>: For visiting — thank you!</p>
    </div>

    <h3 class="about_us_text" style="text-align: center; margin-top: 2rem;">
        Thanks for using <b>TRL Stats</b> 💚
    </h3>
</main>

<script>
    const hamburger = document.querySelector('.hamburger');
    const navMenu = document.querySelector('.nav-menu');
    hamburger.addEventListener('click', () => {
        hamburger.classList.toggle('active');
        navMenu.classList.toggle('active');
        document.body.classList.toggle('menu-open');
    });
    navMenu.querySelectorAll('a').forEach(link =>
        link.addEventListener('click', () => {
            hamburger.classList.remove('active');
            navMenu.classList.remove('active');
            document.body.classList.remove('menu-open');
        })
    );
</script>
</body>
</html>