Skip to content

First stage exercise for permanent UI developer hires.

Notifications You must be signed in to change notification settings

geomians/ui-exercise

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Valtech logo

UI exercise

Overview

We are interested in your approach to the following problems. Each of the given problems have a handful of valid solutions, and possibly other solutions we haven't seen, so don't worry about finding "the" solution. It should render correctly in all major browsers and devices.

Getting started

Fork this project.

Commit each exercise once you've finished with it.

Exercise #1

Create a full width page with a header, a footer and a main section in index.html. The main section should contain a content section and a sidebar. Set the width of the content section to 70% and the sidebar section to 30%. The sidebar should appear on the right hand side of the content section.

index.html should include these assets:

  • https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js
  • test.js
  • test.css

The header section should contain a navigation bar with three links:

  • Home ( index.html )
  • About ( /about )
  • Blog ( /blog )

Exercise #2

Style the header in whatever way you think suits.

In the content section of index.html build the following design.

HTML Layout

Exercise #3

Add a new link to the header called "sidebar", when clicked on will show/hide the sidebar with a transition effect.

Finish up

Once you're finished, send us a link to your fork.

About

First stage exercise for permanent UI developer hires.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •