activities.html

<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
  <link rel="icon" type="image/jpeg" href="assets/logo/pduam-logo.jpg" />
  <link rel="canonical" href="https://csc.pduamamjonga.in/cssa/activities">
  <meta name="robots" content="index, follow">
  <meta property="og:title" content="CSSA — Computer Science Students' Association, PDUAM">
  <meta property="og:description" content="The Computer Science Students' Association at PDUAM — community, curriculum, and career for CS students in Amjonga, Assam.">
  <meta property="og:url" content="https://csc.pduamamjonga.in/cssa/activities">
  <script type="application/ld+json">
  {
  "@context": "https://schema.org",
  "@type": "EducationalOrganization",
  "name": "Computer Science Students' Association (CSSA)",
  "alternateName": "CSSA PDUAM Amjonga",
  "url": "https://csc.pduamamjonga.in/cssa/",
  "parentOrganization": {
    "@type": "CollegeOrUniversity",
    "name": "Pandit Deendayal Upadhyaya Adarsha Mahavidyalaya, Amjonga",
    "url": "https://csc.pduamamjonga.in/"
  },
  "description": "The Computer Science Students' Association (CSSA) at PDUAM Amjonga connects students and developers to shape software innovation.",
  "knowsAbout": [
    "Computer Science",
    "Software Development",
    "Web Engineering",
    "Algorithms",
    "Database Systems"
  ]
}
  </script>
  <script>
  if (window.location.hostname === 'cscpduama.github.io') {
    window.location.replace('https://csc.pduamamjonga.in' + window.location.pathname.replace(/^\/CSSA/i, '/cssa'));
  }
  if (window.location.hostname === 'csc.pduamamjonga.in' || window.location.hostname === 'csc.pduamamjonga.ac.in' || window.location.hostname.includes('pduamamjonga') || window.location.hostname === 'cscpduama.github.io') {
    const base = document.createElement('base');
    base.href = '/cssa/';
    document.head.insertBefore(base, document.head.firstChild);
  }
</script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Activities | CSSA PDUAMA</title>
<meta name="description" content="Upcoming and past CSSA events — workshops, hackathons, talks, and socials.">
<link rel="stylesheet" href="styles.css">
</head>
<body>

<header class="site-header">
  <div class="wrap">
    <a href="index.html" class="brand">
      <span class="brand-mark">&lt;/&gt;</span>
      <span class="brand-text"><span class="b1">CSSA</span><br><span class="b2">Computer Science Students' Association · PDUAM</span></span>
    </a>
    <nav class="nav" id="site-nav">
      <a href="index.html">Home</a>
      <a href="about.html">About</a>
      <a href="members.html">Members</a>
      <a href="academics.html">Academics</a>
      <a href="projects.html">Projects</a>
      <a href="activities.html" aria-current="page">Activities &amp; Events</a>
      <a href="gallery.html">Gallery</a>
      <a href="contact.html" class="nav-cta">Contact</a>
    </nav>
    <button class="nav-toggle" aria-label="Toggle menu" aria-expanded="false" aria-controls="site-nav"><span></span><span></span><span></span></button>
  </div>
</header>

<main>
  <section class="hero" style="padding-top:56px;">
    <div class="wrap">
      <h1 style="font-size:clamp(38px,7vw,74px);">Activities</h1>
      <div class="hero-meta">
        <p class="hero-sub">From workshops to hackathons, our calendar is packed with moments to learn, build, and connect. There's always something happening in the CSSA community.</p>
        <div class="page-links">
          <span class="label">Page content&nbsp;|</span>
          <a href="#Activities">Events</a>
          <a href="#recurring">Recurring</a>
        </div>
      </div>
      <div class="hero-figure">
        <div class="ph ph-hero ph-circuit"><span class="ph-label">Image placeholder — activities / event photo</span></div>
      </div>
    </div>
  </section>

  <section>
    <div class="wrap" data-filter-group>
      <div class="events-tools">
        <div class="field">
          <label for="event-filter">Filter for</label>
          <select id="event-filter" data-filter-select>
            <option value="all">Select one…</option>
            <option value="workshop">Workshop</option>
            <option value="hackathon">Hackathon</option>
            <option value="talk">Talk</option>
            <option value="social">Social</option>
          </select>
          <a href="#" class="reset-link" data-filter-reset>Reset</a>
        </div>
        <div class="field">
          <label for="event-search">Search</label>
          <input type="text" id="event-search" placeholder="Search events…" data-filter-search>
        </div>
      </div>

      <!-- Event 1 -->
      <div data-filter-item data-tags="workshop" data-title="Git & GitHub for Beginners" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>DECEMBER 20, 2025</span><span class="tag">| WORKSHOP</span></div>
            <div class="event-title">Git &amp; GitHub for Beginners</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>A hands-on coding workshop helping students master version control concepts, branching workflows, pull requests, and collaborative repository management on GitHub.</p>
        </div>
      </div>
      
      <!-- Event 2 -->
      <div data-filter-item data-tags="hackathon" data-title="CodeSprint 2025" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>DECEMBER 15, 2025</span><span class="tag">| HACKATHON</span></div>
            <div class="event-title">CodeSprint 2025</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>Our premier programming tournament testing data structures, search algorithms, and logical coding speed across multiple difficulty tiers. Winners will be awarded department certificates.</p>
        </div>
      </div>
      
      <!-- Event 3 -->
      <div data-filter-item data-tags="talk" data-title="Careers in Software Engineering" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>DECEMBER 10, 2025</span><span class="tag">| TALK</span></div>
            <div class="event-title">Careers in Software Engineering</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>An interactive panel inviting system developers and tech alumni to discuss career preparation, interview patterns, and fields like database administration, network engineering, and frontend design.</p>
        </div>
      </div>
      
      <!-- Event 4 -->
      <div data-filter-item data-tags="workshop" data-title="Intro to Web Development" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>NOVEMBER 28, 2025</span><span class="tag">| WORKSHOP</span></div>
            <div class="event-title">Intro to Web Development</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>Learn the fundamentals of modern HTML5, CSS3 layout engines, and responsive web design patterns to build your first website.</p>
        </div>
      </div>
      
      <!-- Event 5 -->
      <div data-filter-item data-tags="social" data-title="CSSA Freshers' Meetup" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>NOVEMBER 12, 2025</span><span class="tag">| SOCIAL</span></div>
            <div class="event-title">CSSA Freshers' Meetup</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>A welcoming social hour to introduce incoming students to the Computer Science Students' Association community and peer network.</p>
        </div>
      </div>
      
      <!-- Event 6 -->
      <div data-filter-item data-tags="talk" data-title="Demystifying Machine Learning" class="event-row">
        <div class="event-header-row">
          <div>
            <div class="event-meta"><span>OCTOBER 30, 2025</span><span class="tag">| TALK</span></div>
            <div class="event-title">Demystifying Machine Learning</div>
          </div>
          <div class="event-plus">+</div>
        </div>
        <div class="event-accordion-body">
          <p>A conceptual talk covering the basics of artificial neural networks, supervised training, and simple predictions.</p>
        </div>
      </div>

      <div class="events-foot">
        <div class="pagination">
          <span class="num active">1</span>
          <span class="num">2</span>
        </div>
      </div>
    </div>
  </section>

  <section class="tight" id="recurring">
    <div class="wrap">
      <div class="eyebrow">Recurring</div>
      <div class="three-col">
        <div class="card">
          <h4 style="font-size:17px; margin-bottom:8px;">Weekly Coding Hour</h4>
          <p style="font-size:14px; color:var(--ink-soft);">Drop-in problem solving every Wednesday evening. All levels welcome.</p>
        </div>
        <div class="card">
          <h4 style="font-size:17px; margin-bottom:8px;">Monthly Tech Talk</h4>
          <p style="font-size:14px; color:var(--ink-soft);">A student or alum presents on a topic of their choice — from OS internals to UI design.</p>
        </div>
        <div class="card">
          <h4 style="font-size:17px; margin-bottom:8px;">Semester Hackathon</h4>
          <p style="font-size:14px; color:var(--ink-soft);">A weekend build sprint held once each semester, open to teams of up to four.</p>
        </div>
      </div>
    </div>
  </section>
  <section>
    <div class="wrap statement">
      <div>
        <div class="eyebrow">Strong Bonds</div>
        <h2>Learning built on doing</h2>
        <p>Every workshop and hackathon is a chance to turn theory into something real — and to meet the people you'll be building with for the rest of your time at PDUAM.</p>
        <p>Have an idea for a session? <a href="contact.html" style="text-decoration:underline;">Let us know</a>.</p>
      </div>
      <div class="globe-wrap">
        <div class="globe ph ph-circuit"></div>
      </div>
    </div>
  </section>
</main>

<footer class="site-footer">
  <div class="wrap">
    <div class="footer-card">
      <div class="brand">
        <span class="brand-mark">&lt;/&gt;</span>
        <span class="brand-text"><span class="b1">CSSA</span><br><span class="b2">Computer Science Students' Association · PDUAM</span></span>
      </div>
      <div>
        <div style="font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;text-align:right;">Find us on socials</div>
        <div class="social"><a href="#" aria-label="Instagram">IG</a><a href="#" aria-label="GitHub">GH</a><a href="#" aria-label="LinkedIn">LI</a></div>
      </div>
    </div>
    <p class="copyright">Copyright © 2026 PDUAM Computer Science Students' Association. All rights reserved.</p>
  </div>
</footer>
<script src="script.js"></script>
</body>
</html>