Harmonise styles with data.govt header template

[tmfrnz]

New data.govt header content (logo and back-link) are within content container, limited to a width of 940px. Ideally dashboard app content should also be limited to same width.

Header

• [x] consider limiting content width to 940px
• [x] consider removing logo graphic (will still need application name)

General

• [x] consider using data.govt font "fira sans"

[tmfrnz]

@camfindlay we will mock up a few options for adjusting the style and will let you know what actions will be required on the CWP side (#root should possibly not be limited by data.govt container to at least allow the header bottom border to run all the way across)

[tmfrnz]

@camfindlay we have adjusted some design and styles to better match the data.govt template - you can re-deploy a WIP version from https://github.com/unfolddata/ogdd/tree/master/dist but please note that the application now requires the more specific root tag <div id="ogdd-root"></div> (#27)

With regards to the design and styles we suggest the following:

• limit content width to 940px but allow dashboard to occupy full width to allow for header bar optic (shadow must run all the way through to not appear broken)
• also align header content with content width, but split logo graphic in 2 parts:
  • application title aligned with content (this is important and should not be removed)
  • logo graphic aligned left with viewport (will float behind title in small screens)
• we find the 'Fira Sans' font not very suitable for use in dashboards and data visualisations as its overall appearance is very vivid, bouncy and active and thus competes for attention (@dmprk can provide more details if needed). If possible we would prefer to have Google's 'Barlow' whitelisted.
• SVG graphics are now being inlined and should no longer be flagged by CSP (#26)

[tmfrnz]

You can also see the latest version on GitHub Pages: https://unfolddata.github.io/ogdd/

[camfindlay]

I see the dash specific logo has been retained -is this still to be removed?

[camfindlay]

Can confirm the svg graphics are working as expected.

[camfindlay]

I need to make some adjustments to styles on the minimal data.govt.nz header but overall fits much better.

[tmfrnz]

yes @camfindlay, if you do not mind we would like to retain the dash specific logo, but align the all the header wording

[camfindlay]

no worries, we'll retain the logo. tested on CWP, I think we can just about run with this release.

[tmfrnz]

Excellent @camfindlay - there are still a few minor issues we are working through (and also the about page content still needs updating) so please do not publish it before our go ahead... Thanks!

[tmfrnz]

@camfindlay did you by the way also white-list the 'Barlow' font? (see above for details)

[camfindlay]

font is fine. Let me know when you've fix minors at your end and I'll pick up here.

[tmfrnz]

@camfindlay just to let you know that we are pretty much final and addressed everything we planned to / we were aware of, so you can go ahead and grab the index.js and update your test page once more if you like. If you are happy and don't experience any further issues, the only changes should concern the data or the content (latter would require a re-build).

[camfindlay]

Other than updating the insights dataset, was there any thing else on your side that will require a rebuild of the index.js?

Otheriwse I'm going to roll a new install and we can deal with the repo handover at a later point (we'll deploy from our fork).

[tmfrnz]

There is nothing on our side that would require a rebuild but I am not sure if @enotsluap and his team have any other change requests (or have considered #30).

Of course the dashboard should not be made public until final go ahead from @enotsluap.

[camfindlay]

updates in draft - this issue can be closed.