Agiledrop Front-end Challenge

If you want to be considered as a candidate for front-end developer, you will have to complete the following tasks.

If you know what you're doing, this task shouldn't take you longer than 4h.

Prerequisites

• Since all our front-end developers work locally, you will have to be able to install the site on your computer. You can use MAMP (OS X), WAMP (Windows) or any other tool that you're used to.
• You must have a basic knowledge of GIT.
• We probably don't have to tell you that you must know CSS, Javascript etc.

Task

Your first task is to set the page locally:

• Fork this repository and clone the code to your computer.
• Install database which is in root folder of the repository to your machine. You can use Phpmyadmin or any other tool to do that.
• Copy the file sites/default/example.settings.local.php to sites/default/settings.local.php. Update the file with the information for your database. Read the comment at the top of that file if you need better instructions.

If you did everything right in previous steps the page should be opening on your localhost.

Now it's time to begin the real work. Below are the tasks that you should accomplish. The basic theme (called adchallenge) is already there and is enabled on the page. If you are not familiar with creating themes in Drupal 8, than you should check this page first. It will help you understand what goes where.

We would like you to use Sass for styling. It doesn't matter how you compile it to CSS, as long as we have Sass files as an end result as well.

Oh, and the last thing - the username and password for the Drupal account is admin/admin.

1. Style the front page using the provided psd. Only style elements that appear on the page. There is more elements in the design, but if we take the front page as an example, you only need to style header (logo and menu), four news items and a footer.
2. If some elements have different order, just style them where they are positioned (hint: look at the news items on front page).
3. Header should be styled in a way that when you scroll down it sticks to the top. There is no design for that, but black background with white links should do it.
4. Also style one of the news - click on it on front page list and style the right sidebar. Everything else should be more or less styled already.
5. Please have in mind that this should look OK on mobile as well.

When done

1. Commit and Push your code to your new repository.
2. Send us a pull request and let us know about that. We will review your code and get back to you.