Kāinga - Section Info

The Kāinga (homepage) is made up of a couple different component sections.

  1. #header-section
  2. #top-white-section
  3. #top-black-and-services-section
  4. #projects-section
  5. #pinkblack-section
  6. #meet-the-team-section
  7. #highlights-section
  8. #blog
  9. #see-more-blog
  10. #blog-subscription
  11. #footer

#Header section

This sticky section lives at the top of the site and is a row of buttons.

  1. Contact - triggers the Contact Form lightbox.
  2. Menu - triggers the Menu lightbox.
  3. Home - Navigates user to homepage. Scrolls to top if user is already on the homepage.

Top White section

This section just contains the main page header "IDEAS SHAPED BY TE REO" and then the small "ATA" sitting above the Top Black section.

Top Black and Services section

This section contains the ATA logo, the definition of ATA, the services circles, and the intro text.

Hovering over the Services circles will trigger the rotate-bubble.md animation and clicking them will open the corresponding Service lightbox.

Projects section

This section is a carousel of "Project" cards. Hovering over will reveal the project name, and clicking will open a dedicated Lightbox for that project where they can scroll through media and details about each one.

NOTE: This section is currently hidden as we didn't have any content for here yet. Shout out when you have some projects to highlight and I can help you with configuring this section.

PinkBlack section

This section starts as black but then fades to pink as the user scrolls. Clicking the "Ready to shape your ideas?" button will open the Contact Form lightbox.

Meet the team section

This section contains the the two text block headers and then the Team Members repeater.

If you want to update the Team Members data - open the collection as described in cms-collections.md and add/modify/delete from there.

Highlights section

NOTE: This section is currently as it was on the original site but not in the Figma. Let me know if you want to re-enable it or delete it. Thanks!

Blog section

This section loads in the most recent blog posts - clicking them will take users to the individual blog post pages.

See more blog section

This section just contains the button "See more blog posts" which takes the users to the Blog page.

Blog subscription section

This section contains the blog subscription data set - more details in wix-form-collections.md for where to view that information.

The footer section lives at the bottom of the page and contains a link to launch the Contact Form lightbox and also links to ATA social media accounts.