{% extends 'base.html' %} {% load static %} {% block body %} <style> .gradient { top: 0; transition: all 0.15s ease-in; opacity: 1; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 60%, rgba(255, 255, 255, 1) 100%); position: absolute; height: 100%; width: 100%; display: table-cell; vertical-align: bottom; } .tc { display: table-cell; } a.cases:hover { text-decoration: none; } a.cases:hover .gradient { opacity: 0; } </style> <div class="container-fluid bg-dark-primary"> <div class="row"> <ol class="col-12 mb-0 breadcrumb"> <li class="breadcrumb-item"> <a href="{% url 'home' %}"><i class="fa fa-home"></i></a> </li> <li class="breadcrumb-item"> <a href="{% url 'caselaw' %}">Case Law</a> </li> {% for item in urls %} <li class="breadcrumb-item{% if forloop.last %} active{% endif %}"> <a {% if not forloop.last %}href="{% url 'caselaw' %}?path= {% for item2 in urls %}{% if forloop.counter0 <= forloop.parentloop.counter0 %}{{ item }}{% endif %}{% endfor %}"{% endif %}> {{ item }} </a> </li> {% endfor %} </ol> <div class="col-md-3 text-white pt-5"> <h4>Headings {% if headingCount > 1 and caseCount > 1 and not filter %} <span class="text-muted">({{ headingCount }})</span> {% endif %} </h4> <hr style="border-color:#ffffff !important"> {% if headingCount > 1 and caseCount > 1 and not filter %} {% for heading in headings %} <div> <a href="{% url 'caselaw' %}?path={% if url %}{{ url }}/{% endif %}{{ heading }}"> <h4 class="d-inline-block" style="color:#D8D8D8"><i class="fa fa-folder-open-o"></i> {{ heading }} </h4> </a> </div> {% endfor %} <br> {% endif %} </div> <div class="{% if not filter %}col-md-9{% else %}col-12{% endif %} bg-light-blue pt-5"> <h4>Cases <span class="text-muted">({{ caseCount }})</span></h4> <hr> <div class="row"> {% for case in cases %} <a class="col-md-4 col-lg-3 mb-3 cases" target="_blank" {% if perms.case_law.view_pdf %}href="/media/{{ case.pdf }}"{% endif %}> <div class="card" style="overflow:hidden;"> <div class="tc"> <div class="card-header"> <span class="text-muted">{{ case.published }}</span> </div> <div class="card-body" style="position:relative; height:150px; overflow:hidden;"> <span class="card-text text-secondary">{{ case.synopsis | linebreaks }}</span> <div class="gradient"> </div> </div> <div class="card-footer p-1"> {% for heading in case.headings.all|dictsort:'name' %} <span class="badge badge-primary">{{ heading.name }}</span> {% endfor %} </div> </div> </div> </a> {% endfor %} </div> </div> </div> </div> <script> $('#search').click(function () { var selected = $('input.filters').filter(function (i, e) { return $(e).is(':checked') }).map(function (i, e) { return $(e).val() }); window.location.href = '{% url 'caselaw' %}?filter=' + selected.toArray().join('/'); }) </script> {% endblock %}