{% extends "base/base.html" %}

{% block title %}L.I.S.A - Dashboard{% endblock %}

{% block css %}
 <link rel="stylesheet" type="text/css" href="/static/css/jquery.gridster.min.css">
{% endblock %}

{% block javascript %}
    <script src="/static/js/jquery.gridster.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function(){ //DOM Ready

        $(".gridster ul").gridster({
            widget_margins: [10, 10],
            widget_base_dimensions: [140, 140]
        });

    });
    </script>
{% endblock %}

{% block content %}
<div class=span12>
    <div class="gridster">
    <ul>
        <li data-row="1" data-col="1" data-sizex="1" data-sizey="1"></li>
        <li data-row="2" data-col="1" data-sizex="1" data-sizey="1"></li>
        <li data-row="3" data-col="1" data-sizex="1" data-sizey="1"></li>

        <li data-row="1" data-col="2" data-sizex="2" data-sizey="1"></li>
        <li data-row="2" data-col="2" data-sizex="2" data-sizey="2"></li>

        <li data-row="1" data-col="4" data-sizex="1" data-sizey="1"></li>
        <li data-row="2" data-col="4" data-sizex="2" data-sizey="1"></li>
        <li data-row="3" data-col="4" data-sizex="1" data-sizey="1"></li>

        <li data-row="1" data-col="5" data-sizex="1" data-sizey="1"></li>
        <li data-row="3" data-col="5" data-sizex="1" data-sizey="1"></li>

        <li data-row="1" data-col="6" data-sizex="1" data-sizey="1"></li>
        <li data-row="2" data-col="6" data-sizex="1" data-sizey="2"></li>
    </ul>
</div>
</div>
{% endblock %}