{"id":26487768,"url":"https://github.com/dedo-dev/four-card-feature-section","last_synced_at":"2025-10-15T09:49:09.404Z","repository":{"id":251656156,"uuid":"838049687","full_name":"dedo-dev/four-card-feature-section","owner":"dedo-dev","description":"Second Challenge of Building responsive layout a path of Learning Path by Frontend Mentor","archived":false,"fork":false,"pushed_at":"2024-08-06T02:17:15.000Z","size":240,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-07T17:47:08.277Z","etag":null,"topics":["bem","css","custom-properties","grid","html","logical-properties","relative-units"],"latest_commit_sha":null,"homepage":"https://dz-four-card-feature-section.vercel.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/dedo-dev.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":"2024-08-04T19:41:34.000Z","updated_at":"2024-09-05T14:59:13.000Z","dependencies_parsed_at":"2024-08-04T21:27:28.735Z","dependency_job_id":"aa8ddd4e-313d-407c-be31-b7627cafeb52","html_url":"https://github.com/dedo-dev/four-card-feature-section","commit_stats":null,"previous_names":["dedo-dev/four-card-feature-section"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/dedo-dev/four-card-feature-section","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dedo-dev%2Ffour-card-feature-section","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dedo-dev%2Ffour-card-feature-section/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dedo-dev%2Ffour-card-feature-section/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dedo-dev%2Ffour-card-feature-section/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dedo-dev","download_url":"https://codeload.github.com/dedo-dev/four-card-feature-section/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dedo-dev%2Ffour-card-feature-section/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279068725,"owners_count":26096554,"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","status":"online","status_checked_at":"2025-10-15T02:00:07.814Z","response_time":56,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["bem","css","custom-properties","grid","html","logical-properties","relative-units"],"created_at":"2025-03-20T06:53:04.698Z","updated_at":"2025-10-15T09:49:09.388Z","avatar_url":"https://github.com/dedo-dev.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Frontend Mentor - Four card feature section solution\n\nThis is a solution to the [Four card feature section challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/four-card-feature-section-weK1eFYK). Frontend Mentor challenges help you improve your coding skills by building realistic projects.\n\n## Table of contents\n\n- [Overview](#overview)\n  - [The challenge](#the-challenge)\n  - [Screenshot](#screenshot)\n  - [Links](#links)\n- [My process](#my-process)\n  - [Built with](#built-with)\n  - [What I learned](#what-i-learned)\n  - [Continued development](#continued-development)\n- [Author](#author)\n\n## Overview\n\n### The challenge\n\nUsers should be able to:\n\n- View the optimal layout for the site depending on their device's screen size\n\n### Screenshot\n\n### Mobile Version\n![](./images/mobile-version.png)\n\n### Desktop Version\n![](./images/desktop-version.png)\n\n### Links\n\n- Solution URL: [Frontend Mentor solution](https://www.frontendmentor.io/solutions/responsive-four-card-feature-using-css-grid-hgYwRLVXHV)\n- Live Site URL: [Demo](https://dz-four-card-feature-section.vercel.app/)\n\n## My process\n\n### Built with\n\n- Semantic HTML5 markup\n- CSS custom properties\n- Flexbox\n- CSS Grid\n- Mobile-first workflow\n- BEM\n- Logical Properties\n\n### What I learned\n\nThis solution was my second submission to this challenge, more than learning I reinforced my knowledge.\nI'm happy with how I improved my skills along the way, the journey is still long of course, but when you look back and you touch the improvement there are only three things to do:\n- To be proud of themselves 🥲\n- Keep learning 📖\n- Keep coding 💻\n\n### Continued development\n\nLike this project, by the next one, I'll be focused on CSS Grid, Flexbox, Fluid typography, Fluid spacing, Custom properties and how to build responsive layouts without using media queries.\n\n## Author\n\n- Frontend Mentor - [@dedo-dev](https://www.frontendmentor.io/profile/dedo-dev)\n- Linkedin - [@daniele-zeppieri](https://www.linkedin.com/in/daniele-zeppieri-0b1a36252/)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdedo-dev%2Ffour-card-feature-section","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdedo-dev%2Ffour-card-feature-section","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdedo-dev%2Ffour-card-feature-section/lists"}