<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>STEMChat</title>
  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="stylesheet" href="/css/pure_css.css">
  <link rel="stylesheet" href="css/feedback.css">
  <link rel="stylesheet" href="/css/about.css">
  <link rel="stylesheet" href="/css/navbar.css">
</head>

<body>



  <div class="topnav" id="myTopnav1">
    <a href="javascript:void(0);" class="icon" onclick="myFunction1()">
      <i>☰</i>
    </a>

    <!-- Navigation links (hidden by default) -->
    <div id="myLinks">
      <a href='/'>Home</a>
      <a href='<%=about%>' class="active">About</a>
      <%if(curr_user){%>
      <a href='<%=home%>'>Chat</a>
      <%}%>
           <a href='<%=blog%>'>Blogs</a>
      <a href='<%=project%>'>Projects</a>

      <a href='<%=feedback%>'>Feedback</a>
      <%if(curr_user){%>
      <a href='<%=profile%>'>Profile</a>
      <%}%>
            <%if(!curr_user){%>
      <a href='<%=home%>'>Login</a>
      <%}%>
            <%if(curr_user){%>
      <a href="<%=logout%>">Logout</a>
      <%}%>

        </div>
        <!-- "Hamburger menu" / "Bar icon" to toggle the navigation links -->

    </div>
    <div class="topnav1" id="myTopnav2">

      <a href='<%=FAQ%>'>FAQ</a>
      <a href='<%=Terms%>'>Terms of Service</a>
      <a href='<%=privacy%>'>Privacy</a>

      <a href="javascript:void(0);" class="icon2" onclick="myFunction2()">
        <i> ☰</i>
      </a>
    </div>

    <div id="main">
      <div class="content">



        <div class="para">
          <h3 class="head_"> <%=abouts.about.description%></h3>
          <UL>
            <LH>Admins</LH>
            <%for(var i=0;i<abouts.about.admins.length;i++){%>
            <LI class="box">
              <%var str=abouts.about.admins[i].avatar_template ;%>
              <% str=str.replace("{size}","80");%>
              <%str=url.substring(0,url.length-1)+str;%>
              <img src=<%=str%>> <a href='/user/<%=abouts.about.admins[i].username%>'>
                <span>
                  <p class="para heading"><%=abouts.about.admins[i].name%></p>
                  <p class="para light"> @<%=abouts.about.admins[i].username%></p>
                </span>
                <span>
                  <p class="head_"><%=abouts.about.admins[i].title%></p>
                </span>
              </a>

            </LI>
            <%}%>
            </UL>
            <UL>
                <LH>Moderators</LH>
                <%for(var i=0;i<abouts.about.moderators.length;i++){%>
            <LI class="box">
              <%var str=abouts.about.moderators[i].avatar_template ;%>
              <% str=str.replace("{size}","80");%>
              <%str=url.substring(0,url.length-1)+str;%>
              <img src=<%=str%>> <a href='/user/<%=abouts.about.moderators[i].username%>'>
                <span>
                  <p class="para heading"><%=abouts.about.moderators[i].name%></p>
                  <p class="para light"> @<%=abouts.about.moderators[i].username%></p>
                </span>
                <span>
                  <p class="head_"><%=abouts.about.moderators[i].title%></p>
                </span>
              </a>
              <br>
            </LI>
            <%}%>
            </UL>
        </div>
        <%console.log(abouts.about.admins)%>


        </div>

        <!--
            <div class='foot'>
                <p> MADE BY BITS 2020</p>
            </div>
            -->

        <center>

          <h4>Stats</h4>
          <table class="table">
            <tbody>
              <tr>
                <th>&nbsp;</th>
                <th>Last 7</th>
                <th>Last 30</th>
                <th>All Time</th>
              </tr>
              <tr>
                <td class="title">Topics</td>
                <td><span class="number"><%=abouts.about.stats.topics_7_days%></span></td>
                <td><span class="number"><%=abouts.about.stats.topics_30_days%></span></td>
                <td><span class="number"><%=abouts.about.stats.topic_count%></span></td>
              </tr>
              <tr>
                <td>Posts</td>
                <td><span class="number"><%=abouts.about.stats.posts_7_days%></span></td>
                <td><span class="number" title="1,086"><%=abouts.about.stats.posts_30_days%></span></td>
                <td><span class="number" title="12,502"><%=abouts.about.stats.post_count%></span></td>
              </tr>
              <tr>
                <td>Users</td>
                <td><span class="number"><%=abouts.about.stats.users_7_days%></span></td>
                <td><span class="number"><%=abouts.about.stats.users_30_days%></span></td>
                <td><span class="number" title="1,224"><%=abouts.about.stats.user_count%></span></td>
              </tr>
              <tr>
                <td>Active Users</td>
                <td><span class="number"><%=abouts.about.stats.active_users_7_days%></span></td>
                <td><span class="number"><%=abouts.about.stats.active_users_30_days%></span></td>
                <td>—</td>
              </tr>
              <tr>
                <td>Likes</td>
                <td><span class="number"><%=abouts.about.stats.likes_7_days%></span></td>
                <td><span class="number" title="2,435"><%=abouts.about.stats.likes_30_days%></span></td>
                <td><span class="number" title="13,606"><%=abouts.about.stats.like_count%></span></td>
              </tr>
            </tbody>
          </table>
        </center>

      </div>


      <script src="/js/ui.js"></script>

      <script>
      //Navbar
        function myFunction1() {
          var x = document.getElementById("myTopnav1");
          if (x.className === "topnav") {
            x.className += " responsive";
          } else {
            x.className = "topnav";
          }
        }

        function myFunction2() {
          var x = document.getElementById("myTopnav2");
          if (x.className === "topnav") {
            x.className += " responsive";
          } else {
            x.className = "topnav";
          }
        }
      </script>
</body>
</html>
