Skip to content

AmeerMoustafa/3-column-preview-card-component

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Frontend Mentor - 3 Column Preview Component

Going through the frontend mentor challenge roadmap to get some practice in. Found this one to be pretty simple, only challenge was getting buttons to look as close to the design as possible. Grid might have been a better option but I opted for flexbox instead. Maybe I will re-do it with grid for practice somewhere down the line. I also should begin trying to look into mobile-first workflow with vanilla CSS. Feels more intuitive with Tailwind or bootstrap.

Screenshot

image

My process:

  • Desktop first Workflow
  • Responsive Design
  • Flexbox

What I learned:

Learned a bit about transitions when it comes to effects like hovering over a button. A simple 0.5s transition made it look so much better than getting flashbanged with a button hover effect.

Helpful resources:

Responsively App - Great app for testing responsiveness, highly recommend it.

live site

About

3 column preview card component

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published