Display most of §1 of the spec (#7)
This commit is contained in:
parent
cb21daca5b
commit
b7f2be8b3e
@ -5,113 +5,267 @@
|
||||
{% load leaflet_tags %}
|
||||
{% load humanize %}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Required meta tags -->
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<script src="bundle.js"></script>
|
||||
</head>
|
||||
{% block content %}
|
||||
<div class="container-fluid">
|
||||
<div class="row" style="background-color: #e3f3fd;">
|
||||
<div class="col-lg-8 border-top-0">
|
||||
<button class="btn btn-info" style="margin:15px 0;padding-left:20px;left:-10px;position:absolute;" onclick="window.history.back()" role="button"><i class="fa fa-arrow-left" aria-hidden="true"></i> {% trans "Back to Map" %}</button>
|
||||
<div style="margin-top:70px;padding:0 20px;">
|
||||
<h1>{{case_study.entry_name}}</h1>
|
||||
<p>{{case_study.synopsis}}</p>
|
||||
</div>
|
||||
<div class="clearfix">
|
||||
<div style="margin-left:20px;">
|
||||
<span class="label label-default">{{case_study.get_sector_of_economy_display}}</span>
|
||||
{% if case_study.positive_or_negative == "P" %}
|
||||
<span class="label label-success">{{case_study.get_positive_or_negative_display}}</span>
|
||||
{% elif case_study.positive_or_negative == "N"%}
|
||||
<span class="label label-danger">{{case_study.get_positive_or_negative_display}}</span>
|
||||
{% endif %}
|
||||
<span class="label label-info">{{case_study.country.name}}</span>
|
||||
</br>
|
||||
<small class="text-muted">Created {{case_study.date_created|naturaltime}} by <i>{{case_study.author}}</i></small>
|
||||
</div>
|
||||
<a class="btn btn-primary btn-lg float-right" href="#" role="button">Get Involved</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/{{case_study.get_video_id}}?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="padding-top:30px;">
|
||||
<div class="col-lg-8">
|
||||
<div id="accordion" role="tablist">
|
||||
<div class="card">
|
||||
<div class="card-header" role="tab" id="headingOne">
|
||||
<h5 class="mb-0">
|
||||
<a data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||||
{% trans "Full Description" %}
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
{% block stylesheets %}
|
||||
{{ super }}
|
||||
|
||||
<div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion">
|
||||
<div class="card-body">
|
||||
{{case_study.full_description}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-header" role="tab" id="headingTwo">
|
||||
<h5 class="mb-0">
|
||||
<a class="collapsed" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
||||
{% trans "Community Voices" %}
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion">
|
||||
<div class="card-body">
|
||||
{{case_study.community_voices}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
{% trans "Factbar" %}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul class="list-group list-group-flush">
|
||||
{% if case_study.area_of_land %}
|
||||
<li class="list-group-item">{% trans "Approximate land area"%}: {{case_study.area_of_land}} km²</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
Attached Files
|
||||
</div>
|
||||
<ul class="list-group list-group-flush">
|
||||
<li class="list-group-item">
|
||||
<a href="#">File One</a></br>
|
||||
<small class="text-muted">Uploaded one month ago</small>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<a href="#">File Two</a></br>
|
||||
<small class="text-muted">Uploaded 3 mins ago</small>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<style>
|
||||
body { font-size: 16px; }
|
||||
|
||||
.col--header {
|
||||
background-color: #e3f3fd;
|
||||
padding: 0 40px;
|
||||
}
|
||||
|
||||
.btn--back { margin: 15px 0; padding-left: 20px; left: -10px; position: absolute; }
|
||||
|
||||
|
||||
.case-mediacoverage a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.footer {
|
||||
background-color: #444;
|
||||
color: #ddd;
|
||||
padding-top: 1em;
|
||||
margin-top: 5em;
|
||||
}
|
||||
|
||||
.linklist {
|
||||
list-style-type: none;
|
||||
text-align: right;
|
||||
margin-left: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.linklist a {
|
||||
color: #ddd;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.linklist a:hover {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.linklist-item--spacer {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
dt { font-weight: bold; }
|
||||
dd { margin-left: 2em; }
|
||||
</style>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2 col--header">
|
||||
<button class="btn btn-info btn--back" onclick="window.history.back()" role="button"><i class="fa fa-arrow-left" aria-hidden="true"></i> {% trans "Back to Map" %}</button>
|
||||
|
||||
<div style="margin-top: 70px;">
|
||||
<h1>{{ case_study.entry_name }}</h1>
|
||||
</div>
|
||||
|
||||
<div class="clearfix">
|
||||
<span class="label label-default">
|
||||
{{ case_study.get_sector_of_economy_display }}
|
||||
</span>
|
||||
|
||||
{% if case_study.positive_or_negative == "P" %}
|
||||
<span class="label label-success">
|
||||
{{ case_study.get_positive_or_negative_display }}
|
||||
</span>
|
||||
{% elif case_study.positive_or_negative == "N" %}
|
||||
<span class="label label-danger">
|
||||
{{ case_study.get_positive_or_negative_display }}
|
||||
</span>
|
||||
{% endif %}
|
||||
|
||||
<span class="label label-default">
|
||||
{{ case_study.get_project_status_display }}
|
||||
</span>
|
||||
|
||||
<span class="label label-info">
|
||||
{{ case_study.country.name }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="text-muted"><small>Case study created {{case_study.date_created | naturaltime}}</small>
|
||||
|
||||
<p>{{ case_study.synopsis }}</p>
|
||||
|
||||
<figure style="text-align: center; margin-top: 20px; margin-bottom: 20px;">
|
||||
<img src="{{ case_study.image.url }}" width="100%">
|
||||
<figcaption>
|
||||
{% if case_study.image_caption %}
|
||||
{{ case_study.image_caption }}<br>
|
||||
{% endif %}
|
||||
{% if case_study.image_credit %}
|
||||
<i>{% trans "Credit(s)" %}: {{ case_study.image_credit }}</i>
|
||||
{% endif %}
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
</div>
|
||||
|
||||
</div> <!-- end row -->
|
||||
|
||||
<div class="row" style="padding-top:30px;">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h2>Contents</h2>
|
||||
|
||||
<p>...
|
||||
|
||||
<h2>Description</h2>
|
||||
|
||||
{{ case_study.full_description | linebreaks }}
|
||||
|
||||
<h2>{% trans "Affected land" %}</h2>
|
||||
|
||||
<dl>
|
||||
{% if case_study.country %}
|
||||
<dt>{% trans "Country" %}:
|
||||
<dd>{{ case_study.get_country_display }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.location_context %}
|
||||
<dt>{% trans "Rural or urban" %}:
|
||||
<dd>{{ case_study.get_location_context_display }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.area_of_land %}
|
||||
<dt>{% trans "Approximate land area" %}:
|
||||
<dd>{{ case_study.area_of_land }} km²
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.land_ownership %}
|
||||
<dt>{% trans "Land ownership" %}:
|
||||
{% if case_study.land_ownership == 'OTH' %}
|
||||
<dd>{{ case_study.land_ownership_details }}
|
||||
{% else %}
|
||||
<dd>{{ case_study.get_land_ownership_display }}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.type_of_ecosystem %}
|
||||
<dt>{% trans "Type of ecosystem" %}:
|
||||
<dd>{{ case_study.get_type_of_ecosystem_display }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.describe_ecosystem %}
|
||||
<dt>{% trans "Description of ecosystem" %}:
|
||||
<dd>{{ case_study.describe_ecosystem | linebreaks }}
|
||||
{% endif %}
|
||||
|
||||
</dl>
|
||||
|
||||
{% if case_study.affects_indigenous %}
|
||||
<h2>{% trans "Affected groups of indigenous people" %}</h2>
|
||||
{{ case_study.affects_indigenous_detail | linebreaks }}
|
||||
{% endif %}
|
||||
|
||||
<h2>Project status</h2>
|
||||
|
||||
<dl>
|
||||
{% if case_study.project_status %}
|
||||
<dt>{% trans "Status" %}:
|
||||
<dd id="project_status">{{ case_study.get_project_status_display }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.start_year %}
|
||||
<dt>{% trans "Start year" %}:
|
||||
<dd id="start_year">{{ case_study.start_year }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.completion_year %}
|
||||
<dt>{% trans "Completion year" %}:
|
||||
<dd id="completion_year">{{ case_study.completion_year }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.project_owners %}
|
||||
<dt>{% trans "Project and facility owners" %}:
|
||||
<dd id="project_owners">{{ case_study.project_owners }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.shareholders %}
|
||||
<dt>{% trans "Shareholders of the project owners" %}:
|
||||
<dd id="shareholders">{{ case_study.shareholders }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.financial_institutions %}
|
||||
<dt>{% trans "Financial institutions" %}:
|
||||
<dd id="financial_institutions">{{ case_study.financial_institutions }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.energy_customers %}
|
||||
<dt>{% trans "Energy consumers" %}:
|
||||
<dd id="energy_customers">{{ case_study.energy_customers }}
|
||||
{% endif %}
|
||||
</dl>
|
||||
|
||||
<h2>Multimedia</h2>
|
||||
|
||||
<figure>
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/{{ case_study.get_video_id }}?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
|
||||
</div>
|
||||
|
||||
<figcaption>
|
||||
{% if case_study.video_caption %}
|
||||
{{ case_study.video_caption }}<br>
|
||||
{% endif %}
|
||||
{% if case_study.video_credit %}
|
||||
<i>{% trans "Credit(s)" %}: {{ case_study.video_credit }}</i>
|
||||
{% endif %}
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
{% if case_study.media_coverage_mainstream or case_study.media_coverage_independent or case_study.social_media_links %}
|
||||
<div class="case-mediacoverage">
|
||||
<h2>{% trans "Media coverage" %}</h2>
|
||||
|
||||
{% if case_study.media_coverage_mainstream %}
|
||||
<h3>{% trans "Mainstream media" %}</h3>
|
||||
{{ case_study.media_coverage_mainstream | urlize }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.media_coverage_independent %}
|
||||
<h3>{% trans "Independent/grassroots media" %}</h3>
|
||||
{{ case_study.media_coverage_independent | urlize }}
|
||||
{% endif %}
|
||||
|
||||
{% if case_study.social_media_links %}
|
||||
<h3>{% trans "Social media" %}</h3>
|
||||
{{ case_study.social_media_links | urlize }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<h2>{% trans "Community Voices" %}</h2>
|
||||
{{ case_study.community_voices | linebreaks }}
|
||||
|
||||
{% if case_study.direct_comms %}
|
||||
<h2>{% trans "Reports of direct communications" %}</h2>
|
||||
{{ case_study.direct_comms | linebreaks }}
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<ul class="linklist">
|
||||
<li><a href="{% url 'index' %}">Map of all projects</a>
|
||||
<li><a href="/about">About us</a>
|
||||
<li class="linklist-item--spacer">© Ojuso 2018
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer text-center">
|
||||
<div class="container-fluid">
|
||||
<span class="text-muted">Ojuso x Yansa</span>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
{% endblock %}
|
||||
</html>
|
||||
|
||||
@ -5,28 +5,27 @@
|
||||
{% load leaflet_tags %}
|
||||
{% load static %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Required meta tags -->
|
||||
<meta charset="utf-8">
|
||||
<title>{% block page_title %}Ojuso{% endblock %}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<link rel="stylesheet" href="{% static 'map/bootstrap/css/bootstrap.min.css' %}" />
|
||||
<link rel="stylesheet" href="{% static 'map/bootstrap/css/bootstrap-theme.min.css' %}" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"/>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans" />
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans" />
|
||||
<link rel="stylesheet" href="{% static 'map/bootstrap/css/bootstrap.min.css' %}" />
|
||||
<link rel="stylesheet" href="{% static 'map/bootstrap/css/bootstrap-theme.min.css' %}" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"/>
|
||||
|
||||
<title>{% block page_title %}Ojuso{% endblock %}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
|
||||
{# Additional Stylesheets #}
|
||||
{% block stylesheets %}
|
||||
<style>
|
||||
.navbar-brand {padding: 5px 15px;}
|
||||
.navbar-brand > img {height: 40px;}
|
||||
.dropdown-menu>li>a.no-hover:hover, .dropdown-menu>li>a.no-hover:focus {
|
||||
background: red;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{# Additional Stylesheets #}
|
||||
{% block stylesheets %}
|
||||
<style>
|
||||
.navbar-brand {padding: 5px 15px;}
|
||||
.navbar-brand > img {height: 40px;}
|
||||
.dropdown-menu>li>a.no-hover:hover, .dropdown-menu>li>a.no-hover:focus {
|
||||
background: red;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-default">
|
||||
<div class="container-fluid">
|
||||
@ -85,12 +84,11 @@
|
||||
{% endif %}
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</body>
|
||||
|
||||
{# CDN Javascript #}
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js" integrity="sha256-JmvOoLtYsmqlsWxa7mDSLMwa6dZ9rrIdtrrVYRnDRH0=" crossorigin="anonymous"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
|
||||
{% block scripts %}{% endblock %}
|
||||
{# CDN Javascript #}
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js" integrity="sha256-JmvOoLtYsmqlsWxa7mDSLMwa6dZ9rrIdtrrVYRnDRH0=" crossorigin="anonymous"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
|
||||
{% block scripts %}{% endblock %}
|
||||
|
||||
</html>
|
||||
{% endspaceless %}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user