Profile Card Component using Sass

Community feedback

• 

  Juveria Dalvi•1,375

  @Juveria-DalviPosted about 3 years ago

  hey.. the accessibility issue says that you should have wrapped all divs in <main> which is the semantic tag ,except for the div with class attribution that should be wrapper in <footer> tag for more details refer w3school.com

  0

  ---

  

  Sebastian Arrieta•270

  @sarrietav-devPosted about 3 years ago

  @juuveria So is it okay to do <main class="card>...?

  0

  

  Juveria Dalvi•1,375

  @Juveria-DalviPosted about 3 years ago

  @sarrietav-dev that's all you have to do

        <main>
            <img src="assets/bg-pattern-top.svg" alt="Circle top" class="circle circle--top"/>
           <img src="assets/bg-pattern-bottom.svg" alt="Circle bg-pattern-bottom" class="circle circle--bottom"/>
          <div class="card">
         <img src="assets/bg-pattern-card.svg" alt="" class="card__pattern"/>
           <figure class="card__figure">
           <img src="assets/image-victor.jpg" alt="Picture on a man so called Victor" class="card__image" />
         </figure>
         <div class="card__details">
          <div class="user-info">
            <h1 class="user-info__name">Victor Crest</h1>
            <span class="user-info__age">26</span>
            <h2 class="user-info__location">London</h2>
         </div>
         <div class="user-stats">
           <div class="user-stats__stat">
             <div class="quantity">80K</div>
             <div class="label">Followers</div>
           </div>
           <div class="user-stats__stat">
             <div class="quantity">803K</div>
             <div class="label">Likes</div>
           </div>
           <div class="user-stats__stat">
             <div class="quantity">1.4K</div>
             <div class="label">Photos</div>
           </div>
         </div>
       </div>
     </div>
  </main>
   </body>```
  

  Marked as helpful

  1

  

  Sebastian Arrieta•270

  @sarrietav-devPosted about 3 years ago

  @juuveria Thanks!

  0

  

  Juveria Dalvi•1,375

  @Juveria-DalviPosted about 3 years ago

  @sarrietav-dev welcome it's quite messy I hope you got it.

  0

  

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  @juuveria Hey Juveria, really great for you giving feedbacks. Just some advise about pasting code, to make it pretty, you could put them in triple backticks. It would look like:

  the code is in here
  

  You nest the codes in the backticks. I can't do it here since it will make it code already. But you first: Put 3 backticks, then press enter, then make 3 backticks again. Then you put the code between those, in the middle.

  2

  

  Juveria Dalvi•1,375

  @Juveria-DalviPosted about 3 years ago

  @pikamart heyyy thanks

  0