NFT - Preview Card

Community feedback

• 

  Christian Prasetya•370

  @christian-prasetyaPosted about 2 years ago

  Congratulations for your solution, it's very nice.

  1. I see you try to use BEM Method for the CSS styling, which is great, but I think there some area of improvement.

  <div class="nftCard__author">
            <img
              class="nftCard__author__avatar"
              src="./assets/images//image-avatar.png"
              alt="author image"
            />
            <p class="nftCard__author__about">
              Creation of <span class="nftCard__author__name">Jules Wyvern</span>
            </p>
          </div>
  

  I think it will be better and will be more easy if you write like this:

  <div class="nftCard__author">
            <img
              class="nftCard__author-avatar"
              src="./assets/images//image-avatar.png"
              alt="author image"
            />
            <p class="nftCard__author-about">
              Creation of <span class="nftCard__author-about-name">Jules Wyvern</span>
            </p>
          </div>
  

  especially when you use scss, it will make your life easier, so basically you can use nesting selector from Scss like this:

  .nftCard__author {
       &-avatar {}
       &-about {}
  }
  

  which will make your life easier when writing the scss code.

  2. I appreciate you try to use Scss, but I think you can improve by folder structuring your scss partial file (it will be very helpful), and create component-like scss file.

  Read this if you don't mind

  3. Try broadening your scss file with @mixins, function, and many more, to unlock the potential of your scss/sass skill. Sass - Guide

  Hope this will help, and I'm sorry if my english little bit bad.

  Marked as helpful

  0

  ---

  

  Avinash DV•150

  @avinashdvPosted about 2 years ago

  @christian-prasetya Thank you for pointing out the improvements in SASS. I rarely used it before in the projects that I worked on, but find it quite helpful and structured in defining styles. I will implement the changes suggested right away in my next challenge.

  0