This challenge has shorter submission, review, appeals and appeals response phases. Make sure you don’t miss any deadline!

Challenge Objectives

• Update the existing navigation component to add animations based on the requirements below.

Project Background

We are in the process of creating the new re-designed Navigation components for our platform.

Technology Stack

• HTML5

• SCSS

• JavaScript

Code Access

Repo: https://github.com/topcoder-platform/community-nav-prototype

Branch: feature-animation

Detailed requirement

As part of this challenge, you need to implement the animation described in this issue https://github.com/topcoder-platform/community-nav-prototype/issues/50

 

We need to achieve the animation without breaking any existing functionality or the layout.

 

Should you have any questions, feel free to ask on the challenge forum!

 

Please do not comment on the issue itself. Use the challenge forum for any questions.

Important Notes

• Use SCSS variables instead of hardcoding colors/paddings etc.

• Use Vanilla JS. No jQuery or any other library is allowed.

• Your code should be as clean, well-structured and well-documented as possible. The goal is to take your code and convert it into different forms (eg wordpress/react/angular) to be able to use it in our various applications.

• Use fluid layout.

• You need to create both logged in and logged out states.

What to Submit

Submit a git patch for the latest commit in the feature-animation branch. Make sure to note the exact commit in your submission so we can apply your patch file.

Final Submission Guidelines

Please read above