{"id":23346706,"url":"https://github.com/dak79/odin-etch-a-sketch","last_synced_at":"2026-05-07T08:37:20.911Z","repository":{"id":163126353,"uuid":"462649951","full_name":"dak79/odin-etch-a-sketch","owner":"dak79","description":"DOM manipulation","archived":false,"fork":false,"pushed_at":"2023-05-26T13:11:55.000Z","size":13,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-13T19:40:43.809Z","etag":null,"topics":["css","git","html","javascript"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dak79.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-02-23T08:41:33.000Z","updated_at":"2022-10-20T09:02:02.000Z","dependencies_parsed_at":"2023-07-18T01:46:01.814Z","dependency_job_id":null,"html_url":"https://github.com/dak79/odin-etch-a-sketch","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dak79%2Fodin-etch-a-sketch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dak79%2Fodin-etch-a-sketch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dak79%2Fodin-etch-a-sketch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dak79%2Fodin-etch-a-sketch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dak79","download_url":"https://codeload.github.com/dak79/odin-etch-a-sketch/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247694879,"owners_count":20980733,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","git","html","javascript"],"created_at":"2024-12-21T07:14:43.696Z","updated_at":"2026-05-07T08:37:15.891Z","avatar_url":"https://github.com/dak79.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Etch-a-Sketch\n\n## Live Preview\n\n[Etch-a-Sketch](https://dak79.github.io/odin-etch-a-sketch/)\n\n## Description\n\nThis project is part of\n[The Odin Project - Foundations Path](https://www.theodinproject.com/lessons/foundations-etch-a-sketch).\nThe goal of this project is to learn about DOM manipulation and a proper use of\nGoogle Search and net resources.\n\n## Technologies\n\n- HTML\n- CSS\n- JavaScript\n- Git\n\n## Assignment\n\n- Create a webpage with a 16x16 grid of square divs.\n\n- Create the divs using JavaScript.\n\n- It’s best to put your grid squares inside another “container” div. There are\n  several different ways to make the divs appear as a grid (versus just one on\n  each line). Feel free to use any or play with each of them: float/clear,\n  inline-block, Flexbox, CSS Grid.\n\n- There are multiple ways to change the color of the divs, including: adding a\n  new class to the div or changing the div’s background color using JavaScript.\n\n- Add a button to the top of the screen that will send the user a pop-up asking\n  for the number of squares per side for the new grid. Once entered, the\n  existing grid should be removed and a new grid should be generated in the same\n  total space as before (e.g. 960px wide) so that you have got a new sketch pad.\n\n- Research button tags in HTML and how you can make a JavaScript function run\n  when one is clicked. Also check out prompts.\n\n- You should be able to enter 64 and have a brand new 64x64 grid pop up without\n  changing the total amount of pixels used.\n\n- Push your project to GitHub!\n\n- Extra Credit: Instead of just changing the color of a square from black to\n  white (for example), have each pass through with the mouse change it to a\n  completely random RGB value. Then try having each pass just add another 10% of\n  black to it so that only after 10 passes is the square completely black.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdak79%2Fodin-etch-a-sketch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdak79%2Fodin-etch-a-sketch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdak79%2Fodin-etch-a-sketch/lists"}