Add light mode (and other improvements)

[ronanru]

Closes #44

• Implemented light mode with css variables All grays in tailwind are reassigned with CSS variables, and they are reversed if light theme is on

While working on this PR, I found other issues, so I fixed them:

• Added missing env variable PUBLIC_MAINTENANCE_ENABLED to .env.example
• Removed google fonts, added FontSource instead for better performance
• Improved a11y by using semantic HTML and adding ARIA attributes
  • Svelte doesn't have a way to generate unique ids (like useId() in React), so I had to install nanoid

Sorry for putting everything into one PR, I can split this PR if needed

[codicocodes]

Can you enable allowing maintainer to make changes to the PR? https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/allowing-changes-to-a-pull-request-branch-created-from-a-fork

[codicocodes]

@ronanru merged this, but would still appreciate any answers on how to move this forward in the future

[ronanru]

Yes, I think the optimal way is to add custom tailwind colors like base, primary, and accent, and use them everywhere instead of gray, green, etc. I can create a PR for this.

[codicocodes]

Yes, I think the optimal way is to add custom tailwind colors like base, primary, and accent, and use them everywhere instead of gray, green, etc. I can create a PR for this.

That would definitely be very appreciated whenever you have time!