cnap-cobre/synapse

{% extends 'base_template.html' %}
{% load static %}
{% load gravatar %}
{% block body_content %}
<div class="wrapper">
  <div class="sidebar" data-background-color="white" data-active-color="danger">
    <!--
    Tip 1: you can change the color of the sidebar's background using: data-background-color="white | brown"
    Tip 2: you can change the color of the active button using the data-active-color="primary | info | success | warning | danger"
  -->
  <div class="logo">
    <a href="/" class="simple-text logo-mini">
       <img src="{% static 'img/logo.png' %}" alt="Powercat Logo" height=30>
    </a>
 
    <a href="/" class="simple-text logo-normal">
       <img src="{% static 'img/logo.png' %}" alt="Powercat Logo" height=30>
       Synapse
    </a>
  </div>
  <div class="sidebar-wrapper">
    {% if user.is_authenticated %}
    <div class="user">
      <div class="photo">
        {% gravatar user.profile.primary_email.email 34 %}
        <!--<img src="{% static 'img/faces/face-2.jpg' %}" />-->
      </div>
      <div class="info">
        <a data-toggle="collapse" href="#collapseExample" class="collapsed">
          <span>
            {{ user }}
            <b class="caret"></b>
          </span>
        </a>
        <div class="clearfix"></div>
 
        <div class="collapse" id="collapseExample">
          <ul class="nav">
            <li>
              <a href="/accounts/profile">
                <span class="sidebar-mini">Mp</span>
                <span class="sidebar-normal">My Profile</span>
              </a>
            </li>
            <li>
              <a href="#edit">
                <span class="sidebar-mini">Ep</span>
                <span class="sidebar-normal">Edit Profile</span>
              </a>
            </li>
            <li>
              <a href="/accounts/logout">
                <span class="sidebar-mini">L</span>
                <span class="sidebar-normal">Logout</span>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    {% endif %}
    <ul class="nav">
      {% block navigation %}
 
      {% endblock %}{# navigation #}
    </ul>
  </div>
</div>
 
<div class="main-panel">
  <nav class="navbar navbar-default">
    <div class="container-fluid">
      <!--<div class="navbar-minimize">-->
        <!--<button id="minimizeSidebar" class="btn btn-fill btn-icon"><i class="ti-more-alt"></i></button>-->
      <!--</div>-->
      <!--<div class="navbar-header">-->
        <!--<button type="button" class="navbar-toggle">-->
          <!--<span class="sr-only">Toggle navigation</span>-->
          <!--<span class="icon-bar bar1"></span>-->
          <!--<span class="icon-bar bar2"></span>-->
          <!--<span class="icon-bar bar3"></span>-->
        <!--</button>-->
        <!--<a class="navbar-brand" href="#typography">{{ title }}</a>-->
      <!--</div>-->
      <!--<div class="collapse navbar-collapse">-->
        <!--<form class="navbar-form navbar-left navbar-search-form" role="search">-->
          <!--<div class="input-group">-->
            <!--<span class="input-group-addon"><i class="fa fa-search"></i></span>-->
            <!--<input type="text" value="" class="form-control" placeholder="Search...">-->
          <!--</div>-->
        <!--</form>-->
        <!--<ul class="nav navbar-nav navbar-right">-->
          <!--<li>-->
            <!--<a href="#stats" class="dropdown-toggle btn-magnify" data-toggle="dropdown">-->
              <!--<i class="ti-panel"></i>-->
              <!--<p>Stats</p>-->
            <!--</a>-->
          <!--</li>-->
          <!--<li class="dropdown">-->
            <!--<a href="#notifications" class="dropdown-toggle btn-rotate" data-toggle="dropdown">-->
              <!--<i class="ti-bell"></i>-->
              <!--<span class="notification">5</span>-->
              <!--<p class="hidden-md hidden-lg">-->
                <!--Notifications-->
                <!--<b class="caret"></b>-->
              <!--</p>-->
            <!--</a>-->
            <!--<ul class="dropdown-menu">-->
              <!--<li><a href="#not1">Notification 1</a></li>-->
              <!--<li><a href="#not2">Notification 2</a></li>-->
              <!--<li><a href="#not3">Notification 3</a></li>-->
              <!--<li><a href="#not4">Notification 4</a></li>-->
              <!--<li><a href="#another">Another notification</a></li>-->
            <!--</ul>-->
          <!--</li>-->
          <!--<li>-->
            <!--<a href="#settings" class="btn-rotate">-->
              <!--<i class="ti-settings"></i>-->
              <!--<p class="hidden-md hidden-lg">-->
                <!--Settings-->
              <!--</p>-->
            <!--</a>-->
          <!--</li>-->
        <!--</ul>-->
      <!--</div>-->
    </div>
  </nav>
 
  <div class="content">
    <div class="container-fluid">
      {% block main_content_area %}
      <div class="row">
        <div class="col-md-12 col-lg-6 col-lg-offset-3">
          <div class="card">
            <div class="card-header">
              <h4 class="card-title">{{ card_title }}</h4>
              {% if card_subtitle %}
              <p class="category">{{ card_subtitle }}</p>
              {% endif %}
            </div>
            <div class="card-content">
              {% block content %}
              {% endblock %}{# content #}
            </div>
          </div>
        </div>
        {% endblock %}{# main_content_area #}
      </div>
    </div>
  </div>
 
  <footer class="footer">
 
  </footer>
</div>
</div>
{% endblock %}{# body_content #}