Create Pages - ariel-fer/Araena GitHub Wiki

Main Structure

This is the typical structure a page will have:

image.png

##Menu Webflow component that will display the menu if the user clicks on the link from the header. It can be isolated from the header or not depending on the styling and the reutilization required.

##Header Displays the company logo and navbar from the top. Also includes the Menu if applicable.

##Hero wraps the main message from the page, along with a footer-logo that is displayed at the bottom. Both have a fixed position and covers the whole window view. It could also be a Webflow component if it can be reused as such.

##Hero-separator (OPTIONAL) Works as a layer that will scroll on top of the hero once the user scrolls down. It will wrap both the content as well as the footer. This is a very specific element implemented to achieve the required scrolling effect

##Main Used to wrap around the page content. Here is where all sections will be included.

##Footer Displays the footer at the bottom of the page. It is included inside the hero-separator as it is the layer that will be displayed on top while scrolling.

Sections

Used for wrapping content that is related. It usually occupies the whole screen width, and can contain some background colors. No sections can be used within others.

Containers

Used for wrapping content that is related, but also needs to be separated from another content within a single section. Many can be stacked within a single section and can be inside other containers.

⚠️ **GitHub.com Fallback** ⚠️