{"id":19543222,"url":"https://github.com/codewithalamin/results-summary-component","last_synced_at":"2026-04-28T16:40:25.437Z","repository":{"id":154934105,"uuid":"623182333","full_name":"CodeWithAlamin/Results-summary-component","owner":"CodeWithAlamin","description":"Completed a FrontendMentor challenge building a responsive web page with a dark mode toggle feature using HTML, CSS, and JavaScript.","archived":false,"fork":false,"pushed_at":"2024-10-30T12:00:20.000Z","size":641,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-26T05:33:19.627Z","etag":null,"topics":["codepapa360","codewithalamin","css3","dark-mode","frontend","frontend-development","frontend-mentor-challenge","html","javascript","responsive-web-design","sass","web-development"],"latest_commit_sha":null,"homepage":"https://result-summary-alamin.netlify.app/","language":"HTML","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/CodeWithAlamin.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":"2023-04-03T21:31:33.000Z","updated_at":"2024-10-30T12:00:25.000Z","dependencies_parsed_at":null,"dependency_job_id":"c6187272-5f8d-447b-bb39-7882cec4e4f8","html_url":"https://github.com/CodeWithAlamin/Results-summary-component","commit_stats":null,"previous_names":["codewithalamin/results-summary-component"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/CodeWithAlamin/Results-summary-component","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FResults-summary-component","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FResults-summary-component/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FResults-summary-component/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FResults-summary-component/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CodeWithAlamin","download_url":"https://codeload.github.com/CodeWithAlamin/Results-summary-component/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FResults-summary-component/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32390053,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-28T14:34:11.604Z","status":"ssl_error","status_checked_at":"2026-04-28T14:32:37.009Z","response_time":56,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["codepapa360","codewithalamin","css3","dark-mode","frontend","frontend-development","frontend-mentor-challenge","html","javascript","responsive-web-design","sass","web-development"],"created_at":"2024-11-11T03:18:02.024Z","updated_at":"2026-04-28T16:40:25.409Z","avatar_url":"https://github.com/CodeWithAlamin.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eResults Summary Component - Frontend Mentor\u003c/h1\u003e\n\u003ch2 align=\"center\"\u003e\nCheck out the \u003ca href=\"https://result-summary-alamin.netlify.app/\" target=\"_blank\"\u003eLive Site here\u003c/a\u003e.\n\u003c/h2\u003e\n\u003c/br\u003e\n\nJust completed the Results [Results summary component challenge from Frontend Mentor](https://www.frontendmentor.io/challenges/results-summary-component-CE_K6s0maV) using HTML, CSS, and a bit of JavaScript to add a dark mode toggle feature. This project was a great way to improve my front-end development skills and build a responsive web page with interactivity. Excited to continue using what I've learned in future projects!\n\n### Screenshot\n\n#### Desktop view\n\n\u003cp\u003e\u003cimg align=\"center\" src=\"screenshots/Screenshot compared - Frontend Mentor Results summary component.png\"/\u003e\u003c/p\u003e\n\n#### Mobile view\n\n\u003cp\u003e\u003cimg align=\"center\" width=\"40%\" src=\"screenshots/Screenshot mobile white - Frontend Mentor Results summary component.png\"/\u003e\u003c/p\u003e\n\n### The challenge\n\nUsers should be able to:\n\n- View the optimal layout for the interface depending on their device's screen size\n- See hover and focus states for all interactive elements on the page\n- **Bonus**: Added Dark Mode feature.\n\n### Links\n\n- 🖱️[Solution URL](https://www.frontendmentor.io/solutions/responsive-results-summary-component-design-with-sass-c8lqEuT6Nh)\n- 🖱️[Live Site URL](https://result-summary-alamin.netlify.app/)\n\n## My process\n\n### Built with\n\n- Semantic HTML5 markup\n- CSS custom properties\n- Flexbox\n- CSS Grid\n- JavaScript\n- Mobile-first workflow\n- NPM\n\n### What I learned\n\nIn completing this challenge, I learned the importance of organizing CSS code to ensure readability and maintainability. I used Sass to help with this. Overall, this challenge was a great opportunity to practice my front-end development skills and apply good coding practices to build a responsive web page with a dark mode toggle feature.\"\n\n## Author\n\n\u003cb\u003e👤 Alamin\u003c/b\u003e\n\n- Twitter - [@CodeWithAlamin](https://www.twitter.com/CodeWithAlamin)\n- LinkedIn - [@CodeWithAlamin](https://www.linkedin.com/in/CodeWithAlamin)\n- Frontend Mentor - [@CodeWithAlamin](https://www.frontendmentor.io/profile/CodeWithAlamin)\n- Github: [@CodeWithAlamin](https://github.com/CodeWithAlamin)\n\nFeel free to contact me with any questions or feedback!\n\n## Acknowledgments\n\nI would like to give a huge thanks to the Frontend Mentor team for creating such an amazing challenge. It was a great opportunity for me to practice my CSS skills and learn new things.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodewithalamin%2Fresults-summary-component","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodewithalamin%2Fresults-summary-component","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodewithalamin%2Fresults-summary-component/lists"}