Skip to content
Submitted over 2 years ago

Simple QR code reader using html and css

Gabriel Silva•20
@BielTsilva
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

the bug has been solved, thanks guys, i really appreciate your helpful.

the styles have a lot of differences, but i really excited with the results, i belive with a little of hard work and hands in the code i can became a good front end.

Community feedback

  • David•8,000
    @DavidMorgadePosted over 2 years ago

    Hello man, congrats on finishing the challenge!

    I have checked your code, and the problem is simple, when you are using relative paths to other files on your project, you need to define that you are in the first folder with ./ instead of just /, so, when you are importing your styles at index.html, you need to link them as: <link rel="stylesheet" href="./assets/styles/style.css">

    Also your img is not loading properly, you need to link it as: <img alt="QR code image content" src="./images/image-qr-code.png">

    With this, your styles and img will be added.

    Hope my answer help you!

    Marked as helpful
    3
    Gabriel Silva•20
    @BielTsilvaPosted over 2 years ago

    @DavidMorgade

    • Tks Man
    1
  • Lucas 👾•104,400
    @correlucasPosted over 2 years ago

    👾Oi Gabriel, beleza? Parabéns pelo seu primeiro desafio!

    Vi aqui o seu código e o que está gerando o erro é que você esqueceu de colocar o ponto antes da barra ./ note que pra indicar uma nivel de pasta se usa um ponto . e uma subpasta dois pontos ../. No caso do seu código ele funcionou porque você estava usando ele local e o VSCODE conseguia reconhecer a pasta, já no Github Pages não pelo fato de ser online.

    <link rel="stylesheet" href="./assets/styles/style.css"> ---> ./assets

    Outra dica que eu tenho pra você é conectar seu Github com o site vercel.com e fazer os upload de site por lá, github pages dá muito problema além de ser chato de configura, ja o vercel em 5 min vc ja configura tudo e o site fica on.

    Abraço e continue codando irmão.

    Marked as helpful
    1
    Gabriel Silva•20
    @BielTsilvaPosted over 2 years ago

    @correlucas

    Valeu pela dica man ...

    1
  • Rodrigo Andre Gutierrez•290
    @rodrigoandreggPosted over 2 years ago

    try removing the " / " at the beginning of each image and style sheet link

    NO:

    <link rel="stylesheet" href="/assets/styles/style.css"> YES: <link rel="stylesheet" href="assets/styles/style.css">

    você está indo bem, não se renda

    Marked as helpful
    0
  • faizan•2,420
    @afaiz-spacePosted over 2 years ago

    Hey @BielTsilva

    • You can rename the Assets/Styles folder to CSS**. then change the path of the CSS file in the HTML file.
    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