Skip to content

Rafaelbpm/frontendmentor_profile_card

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Frontend Mentor - Profile card component

Design preview for the Profile card component coding challenge


Screenshot

My final designMy Final Design

Table of contents


Overview

Overall, this challenge was relatively easy and fun to do. I had no problems doing the card and other elements, although I did struggle a lot working with the background images. That made me realize I need to practice more "Image Positions" on CSS.

I'm also having many difficulties getting a grasp of media queries and need to double my efforts on this matter. It's not hard to understand but, for some reason, is making me confused with the min-max properties.

Thanks for reading this :D

Let’s connect

Find my socials below.


Links


My process

  • Take a look at the project as a whole.
  • Identifying the key elements of the project.
  • Break the project in small parts.
  • Organize the project folder.
  • Organize all the assets into the right folders.
  • Look and study the style guide.
  • Initiate GIT repo.
  • HTML.
  • CSS.
  • Prepare the README file.
  • Upload project.
  • Add the project to a live site server.
  • Share with the community and get feedback.
  • Improve project based on constructive feedback.

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • Mobile-first workflow

Continued development

Areas that I need to improve and practice more:

  • Media Queries
  • CSS Positioning: Relative, Fixed, Absolute.

Useful resources


Author


About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published