Skip to content
Submitted almost 2 years ago

QR code component

Nouarah Khalfallah•10
@nouarah
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I uesd vuejs and uikit in this project to practice vuejs more.

feel free to suggest anything for enhancement

Community feedback

  • Atif Iqbal•3,200
    @atif-devPosted almost 2 years ago

    Hi Nouarah Khalfallah, congrats🎉 on completing the challenge. Better take care about following points.

    • Always check Frontendmentor Report Generator issues after submitting the project for removing errors and warnings. To avoid accessibility issue "All page content should be contained by landmarks" use code as :
    <body>
    <main>
        ---your code here----
    </main>
  <footer>
  </footer>
</body>

    (why main matters? Read here)

    • For proper centering the container(whole card) vertically and horizontally you can use code as:
    body {
    min-height: 100vh;
    display: grid;
    place-content: center;
}

    Or you can learn centering from here.

    (plus remove un-necessary scroll)

    • When we open GitHub repository link, at right side you will find an About Section. There, also include live preview link of your project. It is better for someone to check your live project while interacting with code.

    If you liked the Feedback, Gladly upvote and click on MARKED AS HELPFUL 😇......Hope you will find this Feedback Helpful.🙂

    Marked as helpful
    1
  • Nemanja Dragun•340
    @ndragun92Posted over 1 year ago

    Hello,

    First of all congratz on finishing the challenge.

    I would like to give some tips while using Vuse as a framework.

    When you make components and use them it is highly recommended to name them with two words Instead of import card from '@/components/card.vue'; could be import card from '@/components/ElCard.vue';

    The main reason for this is to avoid collision with HTML5 native tags which are usually single words. What can happen is if you create a component that is or will be an HTML tag it will break your initial implementation.

    Take care

    Marked as helpful
    0
    Nouarah Khalfallah•10
    @nouarahPosted over 1 year ago

    @ndragun92 thank you, it was my first steps to vue, i will use it in the challenges to practice more

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord