Build a responsive webpage that emulates the layout of icons on a smart phone home screen. Use the attached mockup (layout.png) as a reference. It should meet the following requirements:
- Responsive layout: screen more than 1000px: show 6 columns, 500px-999px: show 4 columns, below 500px: show 2 columns
- Icon should be draggable. To drag an icon a user must click and hold for a second or so.
- Dragging an icon into other icons should re-order the icons on the screen.
- Use png's for icons, 80px x 80px. Icons should be retina ready
- Extra Credit: Add a CSS only wallpaper design.
You can use whatever libraries you want to develop this as long as it consists of HTML/CSS/JS. You can send us a zip file of the page, or host it somewhere (such as Github), whatever works for you.
Tested in IE11, Edge, Chrome and Firefox
- Joey Leger - joey80