akai-org / akai-page Goto Github PK

It is desirable to have fully responsive layout, navbar is one of the core components that should be very responsive. We need some solution to handle it.

There isn't any design yet.

If you need some inspiration, here is one of previous designs:

by @hejmsdz

This is index page for our website. There is nothing more to say, just follow the design and experiment with it, it is not immutable.

A static website shouldn't be literally static. Some animations would make it feel like living thing.
Framer Motion is lightweight and very powerful library for animations. We could use react-spring, but Framer Motion is enough for goal.
There is a lot of articles about the usage of Framer with Next.js, e.g. https://reacttricks.com/animating-next-page-transitions-with-framer-motion.
Docs are right here: https://www.framer.com/motion.
Waiting for suggestions about the look of animations.

In Next.js it is recommended that there is Layout component which would be used for almost every page.
There is article about using _app.js custom component: https://reacttricks.com/nested-dynamic-layouts-in-next-apps.
It is also good opportunity to write global css rules.
As you explore our design, you will see that some components are repetitive, i.e. Navbar, Footer. We should put them into Layout Component.

This is events page for our website. There is nothing more to say, than just follow the design and experiment with it, it is not immutable.