https://github.com/dedo-dev/meet-landing-page
Last Challenge of Building responsive layout a path of Learning Path by Frontend Mentor
https://github.com/dedo-dev/meet-landing-page
bem css custom-properties flexbox grid html logiacal-properties relative-units
Last synced: about 1 month ago
JSON representation
Last Challenge of Building responsive layout a path of Learning Path by Frontend Mentor
- Host: GitHub
- URL: https://github.com/dedo-dev/meet-landing-page
- Owner: dedo-dev
- Created: 2024-08-11T16:13:43.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-09-08T17:47:34.000Z (8 months ago)
- Last Synced: 2024-09-08T19:22:02.957Z (8 months ago)
- Topics: bem, css, custom-properties, flexbox, grid, html, logiacal-properties, relative-units
- Language: HTML
- Homepage: https://dz-meet-landing-page.vercel.app/
- Size: 1.94 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Frontend Mentor - Meet landing page solution
This is a solution to the [Meet landing page challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/meet-landing-page-rbTDS6OUR). Frontend Mentor challenges help you improve your coding skills by building realistic projects.
## Table of contents
- [Overview](#overview)
- [The challenge](#the-challenge)
- [Screenshot](#screenshot)
- [Links](#links)
- [My process](#my-process)
- [Built with](#built-with)
- [What I learned](#what-i-learned)
- [Continued development](#continued-development)
- [Author](#author)
## Overview
### The challenge
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover states for interactive elements
### Screenshot
### Links
- Solution URL: [Challenge Solution](https://www.frontendmentor.io/solutions/meet-landing-page-using-flexbox-and-grid-u07yWLY8II)
- Live Site URL: [Live Demo](https://dz-meet-landing-page.vercel.app/)
## My process
### Built with
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- BEM
### What I learned
In this challenge I learned how to work with `:has()` pseudo-class.
```css
.wrapper:has(.hero) {
/* Some style here */
}
```
### Continued development
For future projects, I would like to learn how to work with **CUBE CSS** and improve my skills with **Semantic HTML** and **CSS**. I want to become more confident with my knowledge and work at the pace of my mind.
## Author
- Frontend Mentor - [@dedo-dev](https://www.frontendmentor.io/profile/dedo-dev)
- Linkedin - [@daniele-zeppieri](https://www.linkedin.com/in/daniele-zeppieri-0b1a36252/)