feature/tailwind 2

[marcjulian]

• simplify purge rules and optin to future changes
• update tailwind 2.0
• use theme() function for colors
• update theme and add new primary color

[github-actions[bot]]

Visit the preview URL for this PR (updated for commit 338ff2c):

https://notiz-dev--pr126-feature-tailwind-2-oifas87a.web.app

_{(expires Thu, 14 Jan 2021 16:15:47 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

[marcjulian]

@garygrossgarten in Tailwind 2.0 new Gray colors are introduced. We should decide which we like to use, as we use gray for the background in our themes.

We should consider downloading and serving our font ourself to improve performance as cross-site caching is changing. We are currently using Muli We can still downloaded through this link, but it seems that I can not find Muli on https://fonts.google.com/specimen/Muli anymore.

[marcjulian]

Do we want to use tailwindcss-typography for the content and customize it to our design?

[garygrossgarten]

@marcjulian try it out and see what it looks like

[garygrossgarten]

@marcjulian what's missing? need this for my latest post

Light Theme:

• hrefs color
• marked colors
• scrollbar

Dark Theme:

• change background-light to something with more contrast to background

General:

• Align Content width with footer/header width -> make header/footer narrower. before:

after:

[marcjulian]

@garygrossgarten a few styles such as blockquote need some more styling in prose and I am going to add the gray background color we are currently using.

[marcjulian]

@garygrossgarten I updated the styles please have a look. I moved most colors into tailwind.config.js, remaining color variables are necessary for dark and light mode such as --text-color and --background. I also renamed --background to --canvas to avoid names like bg-background, would be now bg-canvas. What do you think?

[marcjulian]

@garygrossgarten awesome! I will merge it now!