{"id":17635882,"url":"https://github.com/aarongarciah/shoot-target-css-game","last_synced_at":"2025-08-27T19:22:40.067Z","repository":{"id":97964402,"uuid":"250904852","full_name":"aarongarciah/shoot-target-css-game","owner":"aarongarciah","description":"🎯 Pure HTML/CSS game. Shoot as many targets as you can!","archived":false,"fork":false,"pushed_at":"2020-03-29T14:24:02.000Z","size":615,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-24T12:00:16.985Z","etag":null,"topics":["animation","bullseye","css","game","html","target","transition"],"latest_commit_sha":null,"homepage":"https://shoot-target-css-game.netlify.com","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aarongarciah.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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":"2020-03-28T22:19:20.000Z","updated_at":"2023-03-07T16:59:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"c67db642-7245-4dd0-a464-5929f58e10f7","html_url":"https://github.com/aarongarciah/shoot-target-css-game","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/aarongarciah%2Fshoot-target-css-game","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aarongarciah%2Fshoot-target-css-game/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aarongarciah%2Fshoot-target-css-game/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aarongarciah%2Fshoot-target-css-game/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aarongarciah","download_url":"https://codeload.github.com/aarongarciah/shoot-target-css-game/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246273516,"owners_count":20750904,"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":["animation","bullseye","css","game","html","target","transition"],"created_at":"2024-10-23T02:14:40.249Z","updated_at":"2025-03-30T03:42:42.700Z","avatar_url":"https://github.com/aarongarciah.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Shoot the Target! Pure HTML/CSS Game](.github/shoot-the-target.jpg)](https://shoot-target-css-game.netlify.com)\n\n[![Netlify Status](https://api.netlify.com/api/v1/badges/9fcb8ff9-c803-40e2-a93f-4bfa94143e8a/deploy-status)](https://app.netlify.com/sites/shoot-target-css-game/deploys)\n\nTry it! https://shoot-target-css-game.netlify.com\n\nThis game is made entirely with HTML and CSS. Shoot as many targets as you can!\n\nIt has been made thanks to this amazing CSS features:\n\n- [Counters](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters)\n- [Custom Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/--*)\n- [Custom cursor](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property) using an [SVG data url](https://stackoverflow.com/a/46017733/2767771)\n- [Animations](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Animations) and the ability to pause them with [`animation-play-state`](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-play-state)\n- [`:target`](https://developer.mozilla.org/en-US/docs/Web/CSS/:target) pseudo-class\n- [Radial Gradients](https://developer.mozilla.org/en-US/docs/Web/CSS/radial-gradient)\n- [`pointer-events`](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events)\n\nIf you wanna read how to build this game step by step read [the post](https://octuweb.com/html-css-dan-mucho-juego/) I wrote for Octuweb 2018 (in spanish).\n\n\u003e I made the first version of this game for the [Alicante Codepen Meetup](https://www.meetup.com/Alicante-Frontend/events/243642935/) on December 12, 2017. It's hosted [on CodePen](https://codepen.io/aarongarciah/pen/ypBoVm).\n\u003e \n\u003e Then, I made a second and improved version of the game on October 1, 2018 for the [\"🎯 HTML + CSS dan mucho juego\"](https://octuweb.com/html-css-dan-mucho-juego/) (in spanish) article published in [Octuweb](https://octuweb.com) 2018. It's hosted [on CodePen](https://codepen.io/aarongarciah/pen/BOEZvY).\n\u003e \n\u003e This final versions has a couple of tweaks but it's pretty much the same version than 2018.\n\n\n## Improvements\n\n- [ ] Add link to restart game\n\n## License\n\nMIT\n\nMade with ♥️ by [Aarón García Hervás](https://aarongarciah.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faarongarciah%2Fshoot-target-css-game","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faarongarciah%2Fshoot-target-css-game","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faarongarciah%2Fshoot-target-css-game/lists"}