DNA_Q

Latest comments

• 

  José Alfonzo•190

  @JoseAlfonzo92Submitted 3 months ago

  What specific areas of your project would you like help with?

  I would appreciate some help with the circle in the score section. I think it doesn't look like the original design.

  

  Results summary component with HTML, CSS and Javascript

  #pure-css#fetch

  1

  10
  

  DNA_Q•60

  @QuayeDNAPosted 3 months ago

  Hey! Thanks for sharing your solution. I took a look at your score circle CSS and have a few suggestions to make it match the design more closely:

  1. The main difference I notice is the gradient - the design uses a linear gradient instead of radial. Here's how you can fix that:

  #score {
      font-weight: 800;
      padding: 2rem;
      border-radius: 50%;
      background: linear-gradient(180deg, #7857FF 0%, #6943FF 100%);
      width: 140px;
      height: 140px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin: 0 auto;
  }
  

  Key changes:

  • Removed the border as it's not in the design
  • Switched to a linear gradient going from top to bottom
  • Adjusted the size to 140px × 140px which looks closer to the design
  • Changed padding to 2rem which gives better spacing
  • Removed the box-shadow comments since they're not needed
  • Used more accurate purple colors from the design

  The score number inside should be around 3.5rem in size, and the "of 100" text should be smaller and slightly transparent.

  Let me know if you have any questions! 😊

  Marked as helpful

  0
• 

  Mateo•50

  @lordymarcSubmitted 3 months ago

  What are you most proud of, and what would you do differently next time?

  Today I learned how to create a README, Github Pages and Figma (sorta kinda). Nicee. Thanks for reading.. I'm too insecure to hear any feedbacks and tell everyone and their mama where i screwed up bye

  What challenges did you encounter, and how did you overcome them?

  Life has been rough lately...mmmh yeah

  What specific areas of your project would you like help with?

  Everything one could think of

  

  QR code component using rare skills

  2

  40
  

  DNA_Q•60

  @QuayeDNAPosted 3 months ago

  ✅ Strengths

  Clean, semantic HTML structure using main, article, and proper headings

  Good accessibility with screen reader support via sr-only class Proper image alt text

  Well-organized CSS with clear naming conventions

  ⚡ Quick Improvements

  <article class="card" tabindex="0">

  🎯 Overall:

  Solid implementation with good attention to accessibility and structure. Minor enhancements could improve user interaction.

  0