Preview-card

Community feedback

• 

  Aakash Verma•6,710

  @skyv26Posted almost 3 years ago

  Hi! Ben, I checked your work and I have some suggestions for you.

  1. you are using margin-left and margin-rigth in order to make gap between the text and the icons. I have a very good solution which is only one line solution for each div for card-value and card-time.

  just add gap: 0.4rem; in your div like below:

  .card__time {
      color: #8bacda;
      display: flex;
      align-items: center;
      gap: 0.4rem;
      /* margin-right: 1rem; */
  }
  

  .card__value {
      color: #00fff7;
      font-size: 1.3;
      display: flex;
      align-items: center;
      gap: 0.4rem;
  }
  

  remove margin from below css properties

  .eth, .clock {
      /* margin-right: 1rem; */
  }
  

  even it is better approach and easy to handle and even make your content alignment and spacing really good.

  2. below 400px your card is touching both right and left edges of mobile viewport so add some margin or make card width little bit less.

  I hope it will help to make more better UI.

  Good Luck

  Marked as helpful

  0
• 

  Anosha Ahmed•9,300

  @anoshaahmedPosted almost 3 years ago

  To avoid accessibility issues in the future have at least one h1 in your code

  Good job! :)

  Marked as helpful

  0