Skip to content

gavrillamahdi/nft-preview-card-component-main

Repository files navigation

Frontend Mentor - NFT preview card component solution

Hello, my name is gavrillamahdi and this is my solution to the NFT preview card component challenge on Frontend Mentor. Frontend Mentor challenges help me improve my coding skills by building realistic projects.

Table of contents

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

Here the screenshot of my web for the solution I've built

Desktop (1440px)

NFT preview card component challenge on Frontend Mentor Desktop Solution

Mobile (375px)

NFT preview card component challenge on Frontend Mentor Desktop Solution

Links

My process

Built with

  • HTML5
  • Mobile-first workflow
  • CSS Flexbox
  • Tailwind CSS - CSS framework

What I learned

This challenge was build to learn Tailwind CSS as now Tailwind CSS is one of the most popular CSS framework. In the past, I've used Bootstrap as my CSS and JS framework. But after I work on this challenge I found out Tailwind CSS is more easy to use and easy to customize for building website.

In this challenge I learn a lot from Tailwind CSS Documentation to define the classes for every CSS property. This challenge is pretty simple I think, to get started and adjust with Tailwind CSS environment. I'm aware that there still a lot of things to learn from this CSS framework, and I'm looking forward to study more and more!

Note: I'm so sorry for my bad English XD. I'm still learning to it ✌

Author

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published