mohnish/money

<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand show-profile" href="/profile">
        <i class="fa fa-usd"></i> money
      </a>
    </div>

    <div class="collapse navbar-collapse" id="main-navbar-collapse">
      <ul class="nav navbar-nav">
        <li>
          <a class="show-profile" href="/profile">
            <i class="fa fa-user"></i>
            <%= localStorage.getItem('username') %>
          </a>
        </li>
        <li class="active">
          <a class="show-bills" href="/bills">
            <i class="fa fa-money"></i> bills
          </a>
        </li>
        <li>
          <a class="show-payment-sources" href="/cards">
            <i class="fa fa-credit-card"></i> cards
          </a>
        </li>
      </ul>

      <p class="navbar-text navbar-right">
        <a class="navbar-link signout" href="/">
          <i class="fa fa-sign-out"></i> signout
        </a>
      </p>
    </div>
  </div>
</nav>

<div id="bill-details">
  <div class="panel panel-primary">
    <div class="panel-heading">
    <span class="edit-bill close"><i class="fa fa-pencil-square-o"></i></span>
      <h3 class="panel-title"><%= name %></h3>
    </div>
    <div class="panel-body">
      <span class="badge">
        $<%= parseFloat(amount).toFixed(2) %>
      </span>

      <span class="label label-primary">
        <%= category.label %>
      </span>

      <p>
        <span class="gray">Due on:</span>
        <strong>
          <%= moment(next_due_date).format("dddd, MMMM Do YYYY") %>
        </strong>
      </p>

      <p>
        <span class="gray">Repeats:</span> <strong><%= repeat_interval.label %></strong>
      </p>

      <p>
        <%= _.map(tags, function(tag) {
          return '<mark><i class="fa fa-tag"></i> ' + tag.name + '</mark>';
        }).join(' ') %>
      </p>
    </div>
  </div>
</div>

<div id="edit-bill-section"></div>
<div id="manage-payments"></div>