index.html

---
layout: default
title: XMPP Chat Client
include_js:
- index-constants
- index
---

<div class="home">
  <div class="section section-about">
    <div class="section-content">
      <h2>Welcome to Gong</h2>
      <p>
        Gong is an open source XMPP chat client. Currently in alpha release.
      </p>
    </div>
  </div>

  <div class="section section-colors">
    <div class="section-content">
      <h2>Customize All the Colors</h2>
      <p>
        Choose your favorite colors and create a unique look.
      </p>
      {% include mini-gong.html %}
    </div>
  </div>

  <div class="section section-fonts">
    <div class="section-content">
      <h2>Customize your Font</h2>
      <p>
        Change your font size and use any font available from
        <a href="https://fonts.google.com"
           target="_blank"
           rel="noopener noreferrer">Google Fonts</a>.
      </p>
      <p class="dynamic-google-font">
        The quick brown fox hit the gong.
      </p>
    </div>
  </div>

  <div class="section section-media-content">
    <div class="section-content">
      <h2>Media Support</h2>
      <p>Watch videos and look at pictures without having to leave the application.</p>
      <ul>
        <li><i class="fa fa-images"></i> Images and GIFS</li>
        <li><i class="fab fa-youtube"></i> YouTube</li>
        <li>
          <img src="/assets/images/get-yarn-logo.png"
               class="icon"
               alt="GetYarn logo" /> GetYarn
        </li>
      </ul>
    </div>
  </div>

  <div class="section section-markdown">
    <div class="section-content">
      <h2>Markdown Support</h2>
      <p>
        Gong supports markdown. This includes text formatting and emojis!
      </p>
      <p class="emojis">
        {% include emojis.html %}
      </p>
    </div>
  </div>

  <div class="section section-messages">
    <div class="section-content">
      <h2>Saved Messages</h2>
      <p>
        Your messages are stashed away so you can view them later.
      </p>
    </div>
  </div>

  <div class="section section-something">
    <div class="section-content">
      <h2>Multi Platform</h2>
      <p>Works on the operating systems below.</p>
      <ul>
        <li><i class="fab fa-windows"></i> Windows</li>
        <li><i class="fab fa-linux"></i> Linux</li>
        <li><i class="fab fa-apple"></i> Mac</li>
      </ul>
      <p>
        <a href="/download">Download</a> it now!
      </p>
    </div>
  </div>
</div>