Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@lucascumsille
lucascumsille committed Sep 18, 2024
1 parent dc7dc4d commit f6bf253
Show file tree
Hide file tree
Showing 5 changed files with 220 additions and 1 deletion.
11 changes: 11 additions & 0 deletions hub/static/css/_area.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,17 @@
@include media-breakpoint-up('lg') {
grid-template-columns: repeat(3, 1fr);
}

&.two-col-grid {
@include media-breakpoint-up('md') {
grid-template-columns: repeat(1, 1fr);
grid-gap: $grid-gutter-width;
}

@include media-breakpoint-up('lg') {
grid-template-columns: repeat(2, 1fr);
}
}
}

.area-data--sm {
Expand Down
Binary file added hub/static/img/map-placeholder.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
207 changes: 206 additions & 1 deletion hub/templates/hub/area.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,46 @@ <h1 class="mb-2" id="area_name">{{ area.name }}</h1>
<p class="mb-0 text-muted">Old parliamentary constituency</p>
<p class="text-danger">This constituency no longer exists. Please select one of the replacement constituencies below</p>
{% elif area_type == "WMC23" %}
<p class="mb-0 text-muted">New parliamentary constituency</p>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary d-inline-block btn-sm p-1" data-bs-toggle="modal" data-bs-target="#exampleModal" aria-label="Open area map">
{% include 'hub/includes/icons/map.html' with width="1.5rem" height="1.5rem" %}
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Demographic context</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-4">
<h3 class="h6">Country of the UK</h3>
<p>Scotland</p>
</div>
<div class="col-md-4">
<h3 class="h6">Urbanisation</h3>
<p>Urban</p>
</div>
<div class="col-md-4">
<h3 class="h6">Population</h3>
<p>123,852</p>
</div>
</div>
<img src="/static/img/map-placeholder.png" alt="James Madeupname" style="object-fit:cover; box-shadow: var(--bs-card-box-shadow);" class="rounded border" width="100%" height="auto">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<p class="mb-0 text-muted d-inline-block lh-0">New parliamentary constituency</p>
<a type="button" class="d-inline-block text-decoration-none" data-bs-toggle="modal" data-bs-target="#exampleModal" aria-label="Open area map">
(Show map)
</a>
{% endif %}
</div>

Expand Down Expand Up @@ -543,6 +582,172 @@ <h3 class="h5">{{ dataset.label }}</h3>
</section>
{% endif %}

<section class="mb-5 mb-lg-6 area-section" id="place">
<div class="d-flex flex-row justify-content-between align-items-center mb-3">
<h2 class="text-primary mb-0">Place</h2>
<a href="#map" class="btn btn-primary btn-sm d-md-none">
{% include 'hub/includes/icons/map.html' with width="1.5rem" height="1.5rem" %}
Go to map
</a>
</div>
<div class="row">
<div class="col-md-6">
<div class="area-data-grid two-col-grid">



<div class="card dataset-card area-data--sm ">

<div class="card-header">
<h3 class="h5">Country of the UK</h3>

</div>
<div class="card-body">

<p class="card-text mb-0 display-6 lh-1 text-primary">Scotland</p>

</div>
<div class="card-footer">
<p class="card-text">

<a href="https://mapit.mysociety.org/">Data from mySociety.</a>




Updated 2024-04-24.


</p>

</div>
</div>


<div class="card dataset-card area-data--sm ">

<div class="card-header">
<h3 class="h5">Estimated child poverty</h3>

</div>
<div class="card-body">

<p class="card-text mb-0 display-6 lh-1 text-primary">17.0%</p>

<p class="card-text mt-2 text-muted">29.3% national average</p>



</div>
<div class="card-footer">
<p class="card-text">

<a href="https://endchildpoverty.org.uk/child-poverty-2024/">Data from End Child Poverty, based on data from DWP/HMRC.</a>


<a href="/future-constituencies/">This dataset has been automatically converted from 2010 parliamentary constituencies.</a>


Percentage of children living in households with a net income (after housing costs) below 60% of the national median.


Updated June 2024.


</p>

</div>
</div>


<div class="card dataset-card area-data--sm area-data--featured">

<div class="card-header">
<h3 class="h5">Index of Multiple Deprivation (IMD)</h3>

</div>
<div class="card-body">


<p class="card-text mb-0 display-6 lh-1 text-primary">4</p>



<p class="card-text mt-2 text-muted">2.8 national average</p>




</div>
<div class="card-footer">
<p class="card-text">

<a href="https://mysociety.github.io/composite_uk_imd/">Data from ONS (England and Wales), NRS (Scotland), and NISRA (Northern Ireland), collated and standardised by mySociety.</a>


<a href="/future-constituencies/">This dataset has been automatically converted from 2010 parliamentary constituencies.</a>


Deciles of deprivation, from 1 (most deprived) to 10 (least deprived). This uses a composite measure of deprivation (including income, employment, education, skills, health, crime, and housing) standardised across the countries of the UK.



</p>

</div>
</div>


<div class="card dataset-card area-data--sm ">

<div class="card-header">
<h3 class="h5">Number of onshore windfarms</h3>

</div>
<div class="card-body">


<p class="card-text mb-0 display-6 lh-1 text-primary">0</p>



<p class="card-text mt-2 text-muted">0.7 national average</p>




</div>
<div class="card-footer">
<p class="card-text">

<a href="https://en.wikipedia.org/wiki/List_of_onshore_wind_farms_in_the_United_Kingdom">Data from Wikipedia.</a>




Updated 2024-04-24.


</p>

</div>
</div>

</div>
</div>
<div id="map" class="col-md-6 mt-3 mt-md-0">
<img src="/static/img/map-placeholder.png" alt="James Madeupname" style="object-fit:cover; box-shadow: var(--bs-card-box-shadow);" class="rounded border" width="100%" height="auto">
</div>
</div>

<div class="area-data-more">
<a href="#place">
More place data
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16" class="" role="presentation" fill="currentColor">&lt;<path d="M11.793 7.041a1.332 1.332 0 0 1 0 1.862l-5.665 5.656a1.32 1.32 0 0 1-.983.441 1.322 1.322 0 0 1-1.316-1.315c0-.378.163-.738.447-.988L9 7.972 4.276 3.247a1.317 1.317 0 0 1-.386-.931C3.89 1.594 4.485 1 5.207 1c.349 0 .684.139.93.386l5.656 5.655z"></path></svg>
</a>
</div>
</section>


<section class="mb-5 mb-lg-6 area-section" id="movement">
<h2 class="mb-3 text-primary">Movement</h2>
Expand Down
2 changes: 2 additions & 0 deletions hub/templates/hub/includes/icons/location.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
<svg width="{{ width|default:'1em' }}" height="{{ height|default:'1em' }}" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg" class="{{ classes }}" role="{{ role|default:'presentation' }}">
<path d="M8 1C5.24312 1 3 3.14531 3 5.78125C3 7.03656 3.57219 8.70594 4.70062 10.7431C5.60687 12.3787 6.65531 13.8578 7.20062 14.5938C7.29277 14.7195 7.41325 14.8218 7.5523 14.8923C7.69134 14.9627 7.84504 14.9995 8.00094 14.9995C8.15683 14.9995 8.31053 14.9627 8.44958 14.8923C8.58862 14.8218 8.7091 14.7195 8.80125 14.5938C9.34563 13.8578 10.395 12.3787 11.3013 10.7431C12.4278 8.70656 13 7.03719 13 5.78125C13 3.14531 10.7569 1 8 1ZM8 8C7.60444 8 7.21776 7.8827 6.88886 7.66294C6.55996 7.44318 6.30362 7.13082 6.15224 6.76537C6.00087 6.39991 5.96126 5.99778 6.03843 5.60982C6.1156 5.22186 6.30608 4.86549 6.58579 4.58579C6.86549 4.30608 7.22186 4.1156 7.60982 4.03843C7.99778 3.96126 8.39991 4.00087 8.76537 4.15224C9.13082 4.30362 9.44318 4.55996 9.66294 4.88886C9.8827 5.21776 10 5.60444 10 6C9.99942 6.53026 9.78852 7.03863 9.41357 7.41357C9.03863 7.78852 8.53026 7.99942 8 8Z" fill="currentColor"/></svg>
1 change: 1 addition & 0 deletions hub/templates/hub/includes/icons/map.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<svg width="{{ width|default:'1em' }}" height="{{ height|default:'1em' }}" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="{{ classes }}" role="{{ role|default:'presentation' }}"><path d="M10 14L6 12.6L2.9 13.8C2.67778 13.8889 2.47222 13.864 2.28333 13.7253C2.09444 13.5867 2 13.4004 2 13.1667V3.83333C2 3.68889 2.04178 3.56111 2.12533 3.45C2.20889 3.33889 2.32267 3.25556 2.46667 3.2L6 2L10 3.4L13.1 2.2C13.3222 2.11111 13.5278 2.13622 13.7167 2.27533C13.9056 2.41444 14 2.60044 14 2.83333V12.1667C14 12.3111 13.9584 12.4389 13.8753 12.55C13.7922 12.6611 13.6782 12.7444 13.5333 12.8L10 14ZM9.33333 12.3667V4.56667L6.66667 3.63333V11.4333L9.33333 12.3667Z" fill="currentColor"/></svg>

0 comments on commit f6bf253

Please sign in to comment.