main.html

{% extends "base.html" %}
{% block logo %}
      <div class="logo">
        <img src="images/logo.png" width="105px" height="111px"/>
        <span>Welcome to Project Loot!<br/>a simple turnbased strategy game</span>
      </div>
{% endblock %}
{% block content %}
      <div class="help">
        <a id="whatIsBlitz">(What is Project Loot?)</a>
      </div>
      <div id="whatIsBlitzDialog" class="dialogContent">
        <div class="dialogTitle">What is Project Loot?</div>
        <div class="dialogBody">
          Project Loot is a game similar to old school RPG's where you
          have limited abilities and take turns during battles. It is a
          multiplayer and single player game designed with cross-platform
          play in mind.<br/>
          The basic gameplay requires 2 to 4 players. Each player has 2
          to 5 Heroes. Each Hero has 3 abilities: Attack, Defend, and
          some special ability that expends a pool of magic points.<br/>
          Each player decides what each hero will do for the current
          round at the same time. When everyone has submit their
          decisions the actions are sorted and put in a queue.<br/>
          The winner is the player who has the most points in his health
          pool at the end of the game. Good Luck!
        </div>
        <div  class="buttonBar">
          <a class="btn" id="closeModal">OK</a>
        </div>
      </div>
      <div class="menu top">
        <a id="enterLobby">Loot!</a>
        <div class="subtext">
          enter the Battle lobby
        </div>
      </div>
      <div class="menu">
        <a id="viewHistory">Your game history</a>
        <div class="subtext">
          view the results of your past games
        </div>
      </div>
      <!--
      <div class="menu">
        <a id="editProfile">Edit your profile</a>
        <div class="subtext">
          edit your name, picture, and default game settings
        </div>
      </div>
      -->
{% endblock %}