Theme and stub hero for next.lifeitself.org

[rufuspollock]

Current default theme of flowershow is not so suited to life itself. We want to revise it.

As well as being important for life itself this is also a chance to learn about how to do theming cleanly for a flowershow based site (and write that up).

Acceptance

• [x] "light" theme similar to current site (but need not be identical as probably about to revise look and feel)
  • [x] default to light theme
  • [x] fonts set in tailwind config and for heading fonts we use the special font Restora we were using before (see https://github.com/life-itself/climate/blob/main/site/styles/globals.css for use on climate site in nextjs app) ✅ 2023-01-19 in PR #270
    • [x] main body font we can leave for now - what were we using before? nunito sans? ✅2023-01-19 ❌ wontfix
  • [x] standard (named?) colors set (in tailwdinf.config.js?) and then used in theme (so that easy to changes color later) ✅ 2023-01-19 set secondary to lifeitself yellow theme color so uses eg. "bg-secondary"
• [x] hero section on front page that resembles current site (no more than hero needed for now as rest will change)
  • [x] Main text
  • [x] Image on RHS
  • [x] Collaborators
• [x] write up of process of theming (at least hero) etc for flowershow as a tutorial
• [x] Search in navbar ✅ 2023-01-17 Added in commit 60196dc

Tasks

• [x] default to light theme for now (so we don't have to wrangle dark them - plus dark/light theme is quite a dev thing that life itself users won't care about i don't think) ✅ 2022-11-06
• [x] Reproduce (roughly) current hero ✅ 2022-11-06
• [x] About and Teams page ✅ 2022-11-08
• [x] Collaborators section ✅ 2022-11-08
• [x] Add fonts and colors plus quick tutorial write up
• [x] Podcast page - using this tailwind template https://tailwindui.com/templates/transmit

[rufuspollock]

@khalilcodes we only need to start on front page with hero section (ignore the rest for now). and the sooner you can push something the better 😄

[khalilcodes]

@rufuspollock pushed the changes from yesterday - PR #185

I was looking at fonts and was thinking if a non-advanced user will be able to add their own in config. Are we looking to do something like that ?

[rufuspollock]

Good question. I think we stick with tailwind and tailwind.config.js.

For flowershow users we can provide a tutorial on how to modify that (if needed and later)

[rufuspollock]

@khalilcodes can you update with current status and add new tasks (i've just updated the acceptance reflecting what we discussed earlier today)

[khalilcodes]

@rufuspollock example writeup documentation for adding fonts and colors can be found here - https://hackmd.io/@khalil/S18UOMwHs/edit

*updated in flowershow issue - https://github.com/flowershow/flowershow/issues/265

[rufuspollock]

I think we stick with tailwind and tailwind.config.js.

For flowershow users we can provide a tutorial on how to modify that (if needed and later).

[rufuspollock]

@rufuspollock example writeup documentation for adding fonts and colors can be found here - https://hackmd.io/@khalil/S18UOMwHs/edit

*updated in flowershow issue - https://github.com/flowershow/flowershow/issues/265

Good start. I would recommend adding a bit more detail and an example on the Hero stuff. Walk through an example where you add some content to the hero with screenshots.

[rufuspollock]

@khalilcodes can you update acceptance criteria with where we are at.