{"action":"closed","issue":{"url":"https://api.github.com/repos/rynatk/assignments/issues/7","labels_url":"https://api.github.com/repos/rynatk/assignments/issues/7/labels{/name}","comments_url":"https://api.github.com/repos/rynatk/assignments/issues/7/comments","events_url":"https://api.github.com/repos/rynatk/assignments/issues/7/events","html_url":"https://github.com/rynatk/assignments/issues/7","id":104523855,"number":7,"title":"Assignment 2-3 - Octodex","user":{"login":"ambethia","id":298,"avatar_url":"https://avatars.githubusercontent.com/u/298?v=3","gravatar_id":"","url":"https://api.github.com/users/ambethia","html_url":"https://github.com/ambethia","followers_url":"https://api.github.com/users/ambethia/followers","following_url":"https://api.github.com/users/ambethia/following{/other_user}","gists_url":"https://api.github.com/users/ambethia/gists{/gist_id}","starred_url":"https://api.github.com/users/ambethia/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ambethia/subscriptions","organizations_url":"https://api.github.com/users/ambethia/orgs","repos_url":"https://api.github.com/users/ambethia/repos","events_url":"https://api.github.com/users/ambethia/events{/privacy}","received_events_url":"https://api.github.com/users/ambethia/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":{"login":"rynatk","id":13787517,"avatar_url":"https://avatars.githubusercontent.com/u/13787517?v=3","gravatar_id":"","url":"https://api.github.com/users/rynatk","html_url":"https://github.com/rynatk","followers_url":"https://api.github.com/users/rynatk/followers","following_url":"https://api.github.com/users/rynatk/following{/other_user}","gists_url":"https://api.github.com/users/rynatk/gists{/gist_id}","starred_url":"https://api.github.com/users/rynatk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rynatk/subscriptions","organizations_url":"https://api.github.com/users/rynatk/orgs","repos_url":"https://api.github.com/users/rynatk/repos","events_url":"https://api.github.com/users/rynatk/events{/privacy}","received_events_url":"https://api.github.com/users/rynatk/received_events","type":"User","site_admin":false},"milestone":null,"comments":1,"created_at":"2015-09-02T16:38:24Z","updated_at":"2015-09-03T12:16:37Z","closed_at":"2015-09-03T12:16:37Z","body":"## Responsive Design: Octodex.\n\n### Description\n\nGitHub has a great mascot called OctoCat. OctoCat even has it's own gallery of variations, created by GitHub itself and fans, called [Octodex](https://octodex.github.com).\n\nUnfortunately, the Octodex is not responsive*! Today, your task is to recreate the layout of The Octodex as closely as possible, but make it responsive. You can use all the tools you have at your disposal to get the job done. Use your browser's Developer Tools to inspect their site to find the exact font sizes and padding amounts.\n\n![](https://dl.dropboxusercontent.com/u/4024808/tiy/octodex.png)\n\n* Well, it turns out it uses javascript set the number of columns on page load, but we want to see interactive responsiveness when we resize our window!\n\n### Objectives\n\n* Understand HTML/CSS Layout\n* Be able to place any element on a page where you want it.\n* Use responsive design techniques to adapt a design to different screen sizes.\n\n## Details\n\n### Deliverables\n\n- [ ] a git repo containing:\n    - [ ] `index.html`\n    - [ ] `styles` folder\n        - [ ] `style.css`\n    - [ ] `images` folder\n        - [ ] with any images you used with your design\n- [ ] a working, publicly visible website with a public URL (i.e. on Github pages).\n\n## Explorer Mode\n\nCreate the page as closely as you possibly can. Use the same fonts, sizes colors. Download some of your favorite Octocat images to use in your page.\n\n## Adventure Mode\n\nIf you're feeling adventurous, use a CSS framework like Bootstrap or Skeleton to layout your page. This will be both easier and harder. :trollface:\n\n## Additional Resources\n\n- http://getbootstrap.com\n- http://getskeleton.com\n- http://google.com/fonts\n- [Learn CSS Layout](http://learnlayout.com/)\n- [CSS Triangle Generator](http://apps.eky.hk/css-triangle-generator/)\n"}}