{% extends "main.html" %}

{% block content %}
<div class="page-layout">
  <div class="home-container">
    <div class="home-content">
      <div class="logo-container">
        <a href="https://bnkops.com">
            <img src="../assets/images/logo-color.png" alt="BNKops Logo" class="main-logo">
        </a></a>
      </div>
      <h1>Welcome to The BNKops Archive 📚</h1>
      <p>Your resource hub for community-powered technology and organizing</p>
      <p>A curated collection of documentation, guides, and resources from The Bunker Operations.</p>
      <p class="subtitle">Build your power, don't rent it. ✊</p>
      
      <div class="home-buttons">
        <a href="resources" class="home-button primary">Browse Resources</a>
        <a href="about" class="home-button secondary">About BNKops</a>
      </div>
    </div>
  </div>
  
  <div class="left-sidebar">
    <div class="sidebar-card resources">
      <div class="card-content">
        <h3>Our Resources</h3>
        <div class="resource-list">
          <a href="archive/" class="resource-item">
            <span class="resource-icon">📚</span>
            <div class="resource-info">
              <strong>BNKops Archive</strong>
              <span>Knowledge base for community power</span>
            </div>
          </a>
          <a href="cm/" class="resource-item">
            <span class="resource-icon">🚀</span>
            <div class="resource-info">
              <strong>Changemaker V5</strong>
              <span>Self-hosted platform for digital campaigns</span>
            </div>
          </a>
          <a href="https://gitea.bnkops.com/" class="resource-item">
            <span class="resource-icon">💻</span>
            <div class="resource-info">
              <strong>Code Repository</strong>
              <span>Access our open-source code</span>
            </div>
          </a>
        </div>
      </div>
    </div>

    <a href="#" class="sidebar-card download">
      <span class="card-icon">⭳</span>
      <div class="card-content">
        <h3>Download Documentation</h3>
        <p>Free & Open Source</p>
      </div>
    </a>
  </div>
  
  <div class="contact-sidebar">
    <div class="sidebar-card contact">
      <div class="card-content">
        <h3>What You'll Find Here</h3>
        <p>Documentation, guides, and resources to help build and maintain your digital campaigns and community infrastructure.</p>
        
        <div class="community-profile">
          <div class="community-info">
            <strong>The Bunker Operations</strong>
          </div>
        </div>
        
        <div class="contact-actions">
          <a href="contact" class="action-btn">
            <span class="icon">📞</span>
            Contact Us
          </a>
          <a href="#" class="action-btn secondary">
            <span class="icon">👥</span>
            Join Community
          </a>
        </div>
      </div>
    </div>
    
    <div class="sidebar-card explore">
      <div class="card-content">
        <h3>Explore Partners</h3>
        <p>Discover additional resources and tools from our partners</p>
        <a href="partners" class="home-button secondary">View All Resources</a>
      </div>
    </div>
  </div>
</div>
{% endblock %}

{% block styles %}
{{ super() }}
<link rel="stylesheet" href="{{ 'stylesheets/home.css' | url }}">
{% endblock %}