aitchiss/up_your_a11y

Category detail page

aitchiss opened this issue · 3 comments

aitchiss commented

This needs to involve a few things -

  • create a category folder under pages
  • create a page for each category (in future could consider doing this programmatically in gatsby-node, but I think the no. of categories doesn't have to be very big or dynamic so this is fine)
  • create a CategoryLayout component that accepts props for header image, topics, etc
  • in each page: get all the mdx with matching category, map them to objects with metadata required by layout (e.g. cover image, title text color, description/preview), pass the article detail list to the CategoryLayout
  • Inside CategoryLayout, render header/title and a list of the topics with their various style settings
  • Link up the category cards from the home page to the relevant category page - this includes making sure the card itself is clickable
aitchiss commented

category names:

  • fundamentals
  • react
  • structure
  • forms
aitchiss commented

Still remaining:

  • Banner designs
  • Responsiveness of text color (title and link) in banner
aitchiss commented

closing, but may need further tweaks to the images etc