Skip to content

usmanasif/devskiller-mid

Repository files navigation

CSS/HTML Home page


Introduction

You are tasked to create engaging home page for a client. Some features were already implemented but there is a request that you finish it up and meet the deadline.

Problem Statement

Please complete missing CSS property definitions so the page displays the appropriate splash loader screen before it displays the home page.

You should implement:

  • fill navbar with black color, make the text inside white and without decoration specific to anchor <a> tags
  • add padding of 15px to nav bar anchor items and display them as a block of elements
  • use flexbox to display the nav html code as a navigation bar. The end result is displayed on the image mentioned below.
  • add home-page.png as a background image to div with class wrapper
  • add Home Page text to span with class heading and set font size to 60px.

For the splash screen:

  • position each circle item absolutely, 50 percent from top and left corners
  • animate each circle item for 2 seconds, infinitely and set rotate keyframe rule for it
  • first circle item should have width and height of 120px and each following circle item after it should have 20px lower size than the one before it

For browser compatibility:

  • make sure includes method used in index.html is browser compatible
  • your implementation should be contained in main.js file

Hints

  • it should throw TypeError if RegEx is used as a first argument
  • it should take a string and an optional position argument

For more details please run task inside devskiller and see failing tests.

Good Luck!

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published