[CAPE] New layout for council page

lucascumsille commented 1 year ago

Fixes: https://github.com/mysociety/caps/issues/420

It also fixes a mobile bug with the emissions chart:

PREVIEW:

Summary page

https://github.com/mysociety/caps/assets/13790153/4a114733-64fc-4581-9cbd-c96780d13dd0

Declaration & Pledges

Scorecards

Emissions

https://github.com/mysociety/caps/assets/13790153/3eb7bd14-e7f5-4972-8bc6-005a89fa4519

Emissions with no Projects

Climate Documents

Similar councils

Mobile

https://github.com/mysociety/caps/assets/13790153/196492bd-9b16-49a5-ae47-02c9055ef41c

Mobile emissions chart

https://github.com/mysociety/caps/assets/13790153/e2c44543-aaa6-4f5c-9275-d6f06992fcd1

@zarino a few weeks ago I showed you that I was having issues with the emissions chart not being displayed correctly, presumably because the when loading the page the chart was hidden. I added fix to that, instead of being display none, I moved it out of the picture with position absolute. That seemed to work in Chrome and Firefox, not sure if it the most elegant solution.

I also added some extra CSS for the mobile version of the content navbar. Let me know what you think

lucascumsille commented 1 year ago

@zarino I forgot to ask you want me to include this section somewhere?

zarino commented 1 year ago

@lucascumsille Yes, we should keep that. I wonder whether maybe we just include it at the bottom of the page, and keep it visible no matter which tab/section of the page is currently active?

lucascumsille commented 1 year ago

@zarino That make sense it won't be districting by doing so. I'll include it then.

lucascumsille commented 1 year ago

I just added a commit that makes the survey visible in every page. This is how it looks like:

ajparsons commented 1 year ago

Having a quick look at this. Good bit is the side navigation fits nicely, but the problems I see are:

This PR but has got a bit disconnected from the core problem of "we need people to understand this site".
Summary page is currently making all stats a bit more abstract and less understandable.
The JS navigation doesn't make use of anchors at all, meaning you can't deep-link (which is part of what we'd want to do here). It also completely breaks without JS enabled (doesn't fall back on a version of the page where everything is visible).
This PR is now a long way behind master, and so is missing the council_card and markdown helpers that could be useful in simplifying this template.

Solution:

Let's keep the side navigation, but also go back to it being one long page (manageable without javascript, or have the different cards rendered as different views rather than in page).
New summary bit at the top that is wordy and explain what the sections are and what it's all for.
Little explain-y bubbles in each section explaining what they are (doing something useful with the new space that's been freed up).
I would also take the opportunity (given we're displaying the names of sections in multiple places) to abstract how this is working a bit (adapting the council-card approach in master) - I'm finding it difficult to follow in the code what's turning things on and off.

So something like this:

Given most of this is django mechanics and writing content, if that's roughly the right direction, I can take a pass at adapting this PR in that direction. Let me know @zarino

zarino commented 1 year ago

As I just mentioned in https://github.com/mysociety/caps/issues/420, I agree with a lot of what @ajparsons says here. (Which is why I’ve not got round to "reviewing" this PR yet, because I knew a bunch of things—like the JS nav / deep linking, and rebase—would take a while to fix.)

@ajparsons let’s have a chat today, if you’re free, about how we can move this forward.

ajparsons commented 1 year ago

I've made my changes and content additions.

Changes:

For the moment, back to one long doc, but can easily be changed back by un-commenting out some lines I left in. Can see this both ways.
Refactored all council cards to use a consistent helper format. New cards can easily be hooked in.
Added explainer content to most existing cards.
Added more links from explainer info back to the search.
Added: area_only and council_only pledges to the search. These will also be part of the table if selected.
Added IMD and emissions profile to search. Replaced geography search's data source (up to date on new councils, in database anyway).
Added text describing current filter (clearer when coming in from link elsewhere).
Updated the polling card and the disabled again.

What needs a look at: