NFT-card-component

Community feedback

• 

  Rio Cantre•9,690

  @RioCantrePosted almost 3 years ago

  Hello there! nice work with this challenge. Looking at your solution, I think you should considered the following as well...

  • The hover state of the design. For the hero image, you can refer it with this one Overlay in Image. Add color: var(--main-cyan); and cursor: pointer; for the .card-body-title:hover and .second-text:hover
  • Adjust the padding into padding: 0.5rem 0 0 0.5rem; in the .container
  • In the .card-body-text , adjust the padding into padding: 0.8rem 0; and add color: var(--soft-blue);
  • Add margin-top: 1rem; in the .eth-line rule set
  • Add display: flex;, justify-content: start; and align-items: center; in .img-section and adjust the margin into margin-top: 1rem;
  • Add padding: 0 0.1rem 0 0.6rem; in the .first-text rule set
  • Import the attribution style in the CSS file and remove style tag
  • Wrap the card with specific tag like main and attribution with footer tag for readability

  Overall you did good and Keep it going!

  Marked as helpful

  0

  ---

  

  Alexander•80

  @AlexanderWiklowPosted almost 3 years ago

  @RioCantre thank you great feedback, i went back and implemented the things you mentioned. Gonna try to use "rem" more from now on

  1
• 

  medghazaly•200

  @med-ghazaPosted almost 3 years ago

  Hi there, nice try but you're missing some things.

  In HTML

  <section class="img-section">
          <img class="avatar" src="assets/images/image-avatar.png">
          <span class="made-by">
             <span class="first-text">
                  Creation of Jules
             </span>
             <span class="second-text">
                 Wyvern
             </span>
         </span>
  </section>
  

  must put (Jules Wyven) In the second span not (Wyvern) Only Ex:

         <span class="made-by">
               <span class="first-text">
                    Creation of
               </span>
               <span class="second-text">
                   Jules Wyvern
               </span>
         </span>
  

  In CSS

  Must Change the color of Phargraphs to :

  color : hsl(215, 51%, 70%)
  

  For More In Formation Look at My code here

  Marked as helpful

  0

  ---

  

  Alexander•80

  @AlexanderWiklowPosted almost 3 years ago

  @med-ghaza Thank you good input, i changed the span to contain the full name. And i looked at your code and got some good tips to use furthermore

  1

  

  medghazaly•200

  @med-ghazaPosted almost 3 years ago

  @AlexanderWiklow don't mention it

  0