{"id":25764394,"url":"https://github.com/mewmewdevart/42csstober","last_synced_at":"2025-02-26T21:17:57.545Z","repository":{"id":196258108,"uuid":"694855557","full_name":"mewmewdevart/42CSSTober","owner":"mewmewdevart","description":"42CSSTober, a CSS illustration for each day in October, because creating only web pages is insufficient.","archived":false,"fork":false,"pushed_at":"2023-10-05T11:14:55.000Z","size":26,"stargazers_count":37,"open_issues_count":0,"forks_count":7,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-02-13T01:47:54.765Z","etag":null,"topics":["42","42csstober","challenge","css","csstober","events"],"latest_commit_sha":null,"homepage":"https://mewmewdevart.github.io/42CSSTober/","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/mewmewdevart.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","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}},"created_at":"2023-09-21T20:49:22.000Z","updated_at":"2023-11-20T03:32:04.000Z","dependencies_parsed_at":null,"dependency_job_id":"a4a91c4a-be4b-4361-9ee6-5752da2d1f11","html_url":"https://github.com/mewmewdevart/42CSSTober","commit_stats":null,"previous_names":["mewmewdevart/42csstober"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mewmewdevart%2F42CSSTober","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mewmewdevart%2F42CSSTober/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mewmewdevart%2F42CSSTober/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mewmewdevart%2F42CSSTober/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mewmewdevart","download_url":"https://codeload.github.com/mewmewdevart/42CSSTober/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240934423,"owners_count":19880992,"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":["42","42csstober","challenge","css","csstober","events"],"created_at":"2025-02-26T21:17:56.893Z","updated_at":"2025-02-26T21:17:57.532Z","avatar_url":"https://github.com/mewmewdevart.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"right\"\u003e\n // Select your language preference: \n\t\u003ca href=\"https://github.com/mewmewdevart/42CSSTober/blob/main/README_ptBR.md\"\u003e🇧🇷\u003c/a\u003e |\n\t\u003ca href=\"https://github.com/mewmewdevart/42CSSTober/blob/main/README.md\"\u003e🇺🇸\u003c/a\u003e\n \u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003e\n42CSSTober\n\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003e\n\t\u003cb\u003e\u003ci\u003eA CSS illustration for each day in October because creating only web pages is not enough.\u003c/i\u003e\u003c/b\u003e\u003cbr\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://mewmewdevart.github.io/42CSSTober/\" target=\"_blank\"\u003eSee the showcase of this challenge\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\t\u003cimg alt=\"GitHub code size in bytes\" src=\"https://img.shields.io/github/languages/code-size/mewmewdevart/42CSSTober?color=6272a4\" /\u003e\n\t\u003cimg alt=\"Main language\" src=\"https://img.shields.io/github/languages/top/mewmewdevart/42CSSTober?color=6272a4\"/\u003e\n\t\u003cimg alt=\"License\" src=\"https://img.shields.io/github/license/mewmewdevart/42CSSTober?color=6272a4\"/\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n 📌 Please, read the entire readme before starting the challenge.\n\u003c/p\u003e\n\n## Challenge 🚀💫\nInspired by [Inktober](https://inktober.com/rules), 42CSSTober is a challenge created by @larcrist for the 42 Ecole Community (Unofficial event) to improve your coding skills by creating daily mini-illustrations primarily using HTML5 and CSS3.\n\nThe challenge involves creating a mini-illustration each day based on the designated theme for that day and your interpretation of it over the course of 31 days in October, +11 Bonus Days, for a total of 42 illustrations crafted with CSS.\n\n## 🎨 List\n**Mandatory List**: \u003cbr\u003e\nA CSS drawing per day, based on the theme of the list.\n\n| Day  | Theme      | Day  | Theme      | Day  | Theme      |\n| ---- | ---------- | ---- | ---------- | ---- | ---------- |\n| 01   | Emoji      | 11   | Creature   | 21   | Folklore   |\n| 02   | Parasite   | 12   | Planet     | 22   | Energy     |\n| 03   | Geek       | 13   | Amethyst   | 23   | DNA        |\n| 04   | Rainbow    | 14   | Halloween  | 24   | Adventure  |\n| 05   | Poisonous  | 15   | Hot        | 25   | Ruby       |\n| 06   | Gold       | 16   | Hypnotic   | 26   | Fear       |\n| 07   | Virus      | 17   | Silicon    | 27   | Big        |\n| 08   | Universe   | 18   | Ghost      | 28   | Music      |\n| 09   | Cosmos     | 19   | Star       | 29   | Mythical   |\n| 10   | Dream      | 20   | Carbon     | 30   | Trap       |\n|      |            |      |            | 31  | Robot      |\n\n**+Bonus List** ⭐ : \u003cbr\u003e\nReference to some 42 school things. In this list, you will have to create the illustration using just one `\u003cdiv\u003e`. Utilizing the properties ::before, ::after, and clip-path can help you.\n\n| Day  | ⭐ Theme                                       | Day  | ⭐ Theme                |\n| ---- | --------------------------------------------- | ---- | ----------------------- |\n| 01   | The meaning of life, the universe, and everything | 07   | Norminette             |\n| 02   | Algorithm                                    | 08   | Artificial Intelligence |\n| 03   | The Hitchhiker's Guide to the Galaxy         | 09   | Bocal                  |\n| 04   | Towel                                        | 10   | Community              |\n| 05   | Dolphins                                     | 11   | ft_transcendence       |\n| 06   | Open Source                                  |      |                        |\n\n### 📝 Rules\n- Don't be a jerk. Be respectful. Don't draw offensive things!\n- Use only CSS, HTML, and maybe JS to create your artwork; no external files like SVG, PNG, or JPG are allowed. Do everything manually, without external imports or shortcuts.\n- Ensure your art is responsive.\n- You don't need to be a student of the school to be able to participate.\n- Keep your project organized with a GitHub repository, with a cool readme, and host the challenges using GitHub Pages to add in the showcase part 👇.\n- Share your results on social media with #42CSSTober hashtag (If you are going to post on [LinkedIn](https://www.linkedin.com/in/mewmewdevart/), tag me).\n- 31 + 11 = 42: As a bonus, we've added an additional +11 challenges to the list (w/ 42 things). These challenges should be developed using only one `\u003cdiv\u003e` (or whatever element you want) along with its `::before` and `::after` pseudo-elements.\n- Have fun! There's no need to follow a strict schedule; you can create daily, adopt an alternate creation rhythm (every other day), or even do a \"5K run\" or create once a week. The key is to maintain consistency. The goal of 42CSSTober is to grow, improve, and develop positive habits while gaining a deeper understanding of CSS properties.\n\n❗️ | A basic understanding of HTML and CSS syntax is recommended, but if you don't have it, it's a good opportunity to learn!\n\n## 📌 Showcase\nThis is an initiative created for the community (and extern) with the intention of helping you learn HTML and CSS skills and problem-solving through daily coding challenges. A web page has been created for you to showcase your solutions to the community. \u003cbr\u003e Read how to contribute to the showcase in [CONTRIBUTING](CONTRIBUTING.md).\n\n## 🛠️ Usage/Tools\n- Computer: Desktop, laptop, etc.\n- Code Editor: Visual Studio Code, Sublime Text, Atom, Brackets, among others.\n- Web Browser: Google Chrome, Mozilla Firefox, Microsoft Edge, or Safari.\n\n## Tips and Tricks 😜\n#### Golden Tip! ✨\n- By Lula from 42São Paulo, avoid attempting to complete all the steps at once. Use Baby Steps! 👶🏾🍼\n\n#### Silver Tip!\n- Create a simple sketch of the drawing you intend to create; this will provide you with a better understanding of which CSS properties need to be applied in the project.\n- Maintain organization in your files.\n- If you reference external illustrations, be sure to credit the artist in your project's Readme. \n\n## ⚠️ Issues\nFeel free to open an issue for bugs or suggestions.\n\n## 📎 References \n- [Github Pages](https://pages.github.com/) | Documentation on how to host a webpage on GitHub\n- [The Shapes of CSS](https://css-tricks.com/the-shapes-of-css/) | How to create geometric shapes with CSS\n- [Extension: Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) | A VSCode extension that allows you to start a local server directly from VSCode to test your website or web application. It automatically refreshes the page in the browser when you make code changes.\n- [CSS Battle](https://cssbattle.dev/) | If you want to practice offline, this website offers daily challenges to help you further improve your skills.\n- [Inktober](https://inktober.com/rules) | Inspiration for the idea\n- [Figma](https://www.figma.com/) | Create your illustration in Figma using geometric shapes; this will greatly assist you in the illustration process.\n- [Flaticon](https://www.flaticon.com/) | A website to inspire you when developing artwork.\n- RTFM!\n\n## License\nThis project is released under the MIT license. [Learn more](LICENSE).\n\n\u003cp align=\"center\"\u003e Developed by cadets for cadets (and extern 😋). \u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmewmewdevart%2F42csstober","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmewmewdevart%2F42csstober","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmewmewdevart%2F42csstober/lists"}