Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add democratic commons links #15652

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed public/images/screencast.gif
Binary file not shown.
9 changes: 9 additions & 0 deletions t/web/country.rb
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,15 @@
end
end

describe 'when displaying democratic commons footer' do
let(:link) { subject.css('.demo-commons-promo') }
before { get '/iran/' }

it 'should link to mySociety Democratic Commons page' do
link.css('a').last[:href].must_equal 'https://www.mysociety.org/democracy/democratic-commons/'
end
end

describe 'HTML validation' do
it 'has no errors in the country page' do
get '/estonia/'
Expand Down
9 changes: 9 additions & 0 deletions t/web/house.rb
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,15 @@
end
end

describe 'when displaying democratic commons footer' do
let(:link) { subject.css('.demo-commons-promo') }
before { get '/australia/representatives/' }

it 'should link to mySociety Democratic Commons page' do
link.css('a').last[:href].must_equal 'https://www.mysociety.org/democracy/democratic-commons/'
end
end

describe 'HTML validation' do
it 'has no errors in the house page' do
last_response_must_be_valid
Expand Down
16 changes: 5 additions & 11 deletions views/country.erb
Original file line number Diff line number Diff line change
Expand Up @@ -41,19 +41,13 @@
</div>
</div>

<div class="page-section page-section--green page-section--gender-balance-promo">
<div class="page-section page-section--green page-section--demo-commons-promo">
<div class="container">

<div class="gender-balance-promo">
<h3>Help us collect gender information for <%= @page.country.name %> by playing our fiendishly addictive online game, Gender Balance!</h3>
<p>Swipe your way through politicians in a flash, and work your way up our leaderboard.</p>
<p><a href="http://gender-balance.org" class="button button--primary">Play Gender Balance now</a></p>

<a href="http://gender-balance.org" class="gender-balance-promo__demo">
<div class="screenshot-wrapper">
<img src="/images/screencast.gif" width="232" height="330" alt="Gender-Balance app preview">
</div>
</a>
<div class="demo-commons-promo">
<h3>Part of the Democratic Commons</h3>
<p>A growing community of individuals and organisations working to make information on every politician in the world freely available to all, through Wikidata.</p>
<p><a href="https://www.mysociety.org/democracy/democratic-commons/">Help gather the data, use it for your own projects — or give us feedback </a></p>
</div>

</div>
Expand Down
13 changes: 9 additions & 4 deletions views/homepage.erb
Original file line number Diff line number Diff line change
Expand Up @@ -14,17 +14,22 @@
</div>
</div>

<div class="page-section">
<div class="page-section homepage__info-links">
<div class="container row">
<div class="column-two-thirds">
<div class="column-one-third">
<h3>What is EveryPolitician?</h3>
<p>Data about every national legislature in the world, freely available for you to use:</p>
<a href="http://docs.everypolitician.org/" class="button button--small">Read more…</a>
<a href="http://docs.everypolitician.org/">EveryPolitician documentation</a>
</div>
<div class="column-one-third">
<h3>Contribute data</h3>
<p>Missing data for your country? Here's how to get that changed:</p>
<a href="http://docs.everypolitician.org/contribute.html" class="button button--small button--secondary">Read more…</a>
<a href="http://docs.everypolitician.org/contribute.html">How to contribute</a>
</div>
<div class="column-one-third">
<h3>Part of the Democratic Commons</h3>
<p>Working to make information on every politician in the world freely available through Wikidata</p>
<a href="https://www.mysociety.org/democracy/democratic-commons/">Democratic Commons</a>
</div>
</div>
</div>
Expand Down
17 changes: 6 additions & 11 deletions views/house.erb
Original file line number Diff line number Diff line change
Expand Up @@ -38,20 +38,15 @@
</div>
</div>

<div class="page-section page-section--green page-section--gender-balance-promo">
<div class="page-section page-section--green page-section--demo-commons-promo">
<div class="container">

<div class="gender-balance-promo">
<h3>Help us collect gender information for <%= @page.country.name %> by playing our fiendishly addictive online game, Gender Balance!</h3>
<p>Swipe your way through politicians in a flash, and work your way up our leaderboard.</p>
<p><a href="http://gender-balance.org" class="button button--primary">Play Gender Balance now</a></p>

<a href="http://gender-balance.org" class="gender-balance-promo__demo">
<div class="screenshot-wrapper">
<img src="/images/screencast.gif" width="232" height="330" alt="Gender-Balance app preview">
</div>
</a>
<div class="demo-commons-promo">
<h3>Part of the Democratic Commons</h3>
<p>A growing community of individuals and organisations working to make information on every politician in the world freely available to all, through Wikidata.</p>
<p><a href="https://www.mysociety.org/democracy/democratic-commons/">Help gather the data, use it for your own projects — or give us feedback </a></p>
</div>

</div>
</div>

59 changes: 15 additions & 44 deletions views/sass/_custom.scss
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,15 @@
}
}

.homepage__info-links {
.column-one-third {
margin-bottom: 2em;
@media (min-width: $large_screen) {
margin-bottom: 0;
}
}
}

.party-groupings__title {
font-size: 0.875em;
margin-bottom: 1.5em;
Expand Down Expand Up @@ -167,55 +176,17 @@
}
}

// My kingdom for a parent selector in CSS!
// Add some extra margin above the promo section because the screencast
// sticks out and it feels a bit tight against the previous section.
.page-section--gender-balance-promo {
.page-section--demo-commons-promo {
@media (min-width: $medium_screen) {
margin-top: 2em;
padding: 3em 0;
}
}

.gender-balance-promo {
@media (min-width: $medium_screen) {
position: relative; // positioning context for the demo gif
padding-left: 340px; // make space for the demo gif
max-width: 44em; // avoid silly long lines
margin: 0 auto; // centred when the window is wide
}

p {
margin-bottom: 0; // avoid extra space after last paragraph
}

p + p {
margin-top: 1em;
}
}

.gender-balance-promo__demo {
display: block; // because it's actually an <a> element
position: relative;
bottom: -2em; // counteract padding-bottom on .page-section

@media (min-width: $medium_screen) {
position: absolute;
left: 0;
bottom: -3em;
}
}

.screenshot-wrapper {
background: transparent url(/images/iphone.png) 0 0 no-repeat;
padding: 70px 24px 0 24px;
margin: 0 auto;
width: 280px;

img {
width: 232px;
height: 330px;
vertical-align: bottom;
.demo-commons-promo {
//Bare-bones promo for now, there's room for a logo or graphics when they exist
max-width: 40em; // avoid silly long lines
a {
text-decoration: underline;
}
}

Expand Down