domwakeling / bowles-website Goto Github PK

Revisit all images used in news pages to ensure that the underlying image (before Gatsby plugin actions) is high enough resolution. This will enable removing the 'click here for PDF' links, which currently do not work.

The ideal method when an existing PDF has been published is:

• grab the PDF from the existing website
• open in Photoshop (convert at 300dpi, standard setting)
• save out as JPG at quality level 10

If a high-quality PDF is not available, check with @domwakeling who should be able to provide one or generate a new higher-quality JPG.

Need to consider whether we're going to use something similar to the current style, which has a preview bar on the side/bottom of the photo plus a text overlay ...

... or think about changing it to something else, maybe something that's closer to the way that ESSKIA does them?

Any change could necessitate changing the photos, which are at a slightly odd proportion at the moment (600 x 350 I think) - it would future-proof the site if we went back to the original photos where they're available and put in higher-resolution versions (which the Gatsby plugins will deal with as appropriate) ... should have most of the photos available although there may be some where I've not retained the original image ...

Need to look at common approach to presentation of blog posts (including styling and layout).

This will need to be used in:

• src/templates/news-post.js, which is the template for individual news items on their own page; and
• src/pages/news.js, which is the replacement 'news' page which shows the last (currently 10?) news posts

It may be useful to create a new 'NewsItem' React component (although not necessary) which can then be rendered in both places. If not, simply need to ensure consistency of style at the moment.

Need to consider:

• styling of title
• styling of date (and time - also decide whether we're going to use the time?)
• styling of main text in news item
• styling of images (they need to be styled so that they are never wider than the available space, and this needs to be responsive)
• styling of links (this is a general issue across the site, need to consider (a) link colour, (b) any text decoration and (c) whether there will be a change for links that are hovered on

On link styling - we will not be using a different colour/style for links that have previously been visited!

• front page
• news list page
• news articles
• monthly summaries?
• race results
• about us
• galleries

Edit the starter-project's src/layout/index.js file (and attendant style/css) to provide a base layout (framework very acceptable)

Preferences:

• content centred on wider screens (possibly 900 overall max)
• left-hand content max 600?
• right-hand nav max 300, collapse/replace on narrow screens
• menu appears in right-hand when visible, as hamburger in navbar otherwise
• page menu appears in right-hand (as currently) with similar animations
  look at replacing the google calendar?!

Test how images work

• in blog posts (via markdown)
• in the news summary (does link still function when in a different location?)
• as link to an underlying object - eg low-res image of the handicaps linked to a full-res version of same?

Google's calendar plugin has always looked a little out of place on the site and will be doubly so with the new style. See whether there is an alternative, client-only (!) to draw down the information and present in a customised layout ...

Check annual news articles etc:

• 2018
• 2017
• 2016
• 2015
• 2014
• 2013
• 2012

fix dropdown menu in 'races' so when you click anywhere other than a year, the menu goes away

Check all news links tie back to an article ...

• 2018
• 2017
• 2016
• 2015
• 2014
• 2013
• 2012

Look at adding a script for build (easy) and deployment (not so easy) rather than having to use FileZilla or similar to deploy manually.

Consider using ftpsync (npm package) - but would need to manually change any file which was updated and reduced in size (doesn't implement timestamp comparison).

30 galleries in total: 0/30

Look at standard implementation for race results, improving on the current style and replicable across seasons.

Also need to consider whether it is possible to change the navbar contents so that, on race pages, the years are visible (otherwise will have to have a selector for the results at the top of the page, which actually wouldn't be the end of the world)

• races 2018
• races 2017
• races 2016
• races 2015
• races 2014
• races 2013
• races 2012
• year selector on race pages

Need to consider and agree:

• font for titles
• font for navbar brand (if different from other titles)
• font for body text
• colour palette - absolutely need a primary colour to be agreed (with appropriate inverse), would be good to also have a complimentary secondary colour

These are 'brand' choices that can easily be applied across the site.

There are numerous articles on the web about brand design for colour and typography ...

The current (as at 20.05.18) build is using the Typography.js plugin together with the Kirkham theme. Absolutely not wedded to this as a final solution!

Sort out open/close of years in the news archive - clicking on an open year should close it again