Skip to content
OverviewSolutions
20
Comments
17
Thiago Morais
@thirraz

All comments

  • Leonardo Viana•30
    @leveau10Submitted over 1 year ago

    Hey! I don't know why but the email input is freezing the page when the typed value increases. Maybe because i'm validating when the user is typing? I don't know...

    Any suggestions will be welcome!

    Base Apparel cooming soon

    1
    Thiago Morais•420
    @thirrazPosted over 1 year ago

    Opa! Primeiro, parabéns por ter completado o desafio! Acredito que posso ajudar a melhorar a resolução com algumas sugestões

    • O site pode estar congelando por conta do evento keyup. Tente usar keypress para ver se resolve o problema
    • Quando o usuário clicar no botão de enviar o e-mail e estiver tudo certo, adicione uma mensagem de sucesso (não esqueça da função preventDefault)
    • A keyword "var" não é mais usada por ser mais antiga, além de agora termos melhores opções como "let" "const"

    E é isso! Qualquer coisa me dá um toque que eu ajudo em mais alguma coisa

    0
  • Thiago Morais•420
    @thirrazPosted over 1 year ago

    a sua resolução tá quente, mas vou deixar duas dicas aqui que acredito serem úteis:

    • Tente se aprofundar no CSS Grid. Muitos devs têm medo da complexidade mas é muito melhor do que flex em diversos casos

    • Tente usar a pseudo-classe ::marker para customizar os bullets da lista, pois assim você usará <ul> e não <p>, o que melhorará a semântica . Vou deixar um link caso se interesse. Marker Pseudoclass

    0
  • Thiago Morais•420
    @thirrazPosted over 1 year ago

    meu mano você tentou fazer esse botão da forma mais criativa possivel, o que é bom, mas não deu o resultado esperado.

    tenta só usar essas propriedades aqui:

    1. padding => para dar espaçamento nas laterais, em cima e embaixo. Ex: padding: 1rem 4rem;
    2. background => para definir a cor do botão;
    3. color => para definir a cor da fonte;
    4. border-radius => para defiinir o arredondamento das bordas. Ex: border-radius: 8px.

    qualquer coisa me dá um retorno para eu saber se certo

    1
  • David Iván Cabello•110
    @davidicabelloSubmitted almost 2 years ago

    Hi! This is my attempt to this challenge. Couldn't make the quotes be on top of the text , any advice and feedback is welcome!

    Advice generator app

    1
    Thiago Morais•420
    @thirrazPosted almost 2 years ago

    firstly, congratulations for complete this challenge!

    you can use the <q> tag to add quotes 😎👍

    Marked as helpful
    1
  • Thiago Morais•420
    @thirrazPosted almost 2 years ago

    I used Tailwind CSS to make this challenge, and for some reason has bugged during development, and I discovered it 3 hours later, so I kept trying, and the width and height of the components didn't work on desktop because of this bug. Basically, I was tricked by my code

    0
  • Thiago Morais•420
    @thirrazPosted almost 2 years ago

    To add quotes you may use the <q> tag, and to show advice you may fetch the API with js. If you have questions you can ask 😎👍

    0
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    firstly, congratulations on completing this challenge!

    I have 2 tips:

    1. I think it's better uses width: 100vh on the body tag, to adjust at any screen size, but if you prefer to use the min and max width it's okay too.

    2. try to use semantic HTML (<article>, <main>, <section>, etc). Here a link to you: Semantic HTML

    sorry if my English is bad =)

    Marked as helpful
    1
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    firstly, congratulations for complete this challenge!

    I have two tips that can improve your code:

    1. Try to use Semantic HTML (<main>, <section>, <article>, etc). I'll leave this link if you want saber mais: Semantic HTML

    2. You can use flex to centralize the card component:

    body { width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; }

    Marked as helpful
    0
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    firstly, congratulations for complete the challenge!

    besides @Renzorr tip, you could use semantic tags for turn your code more legible. Here is a link about it and may help you Semantic HTML

    0
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    firstly, congratulation for complete this challenge! It's very good!

    I have 2 tips for improve your code:

    1. Try use semantic tags to make your code more legible: ex: <main>, <article> , <section>, and more others. This link may help you Semantic HTML

    2. You can centralize the card using flex: body{ width:100vw; height: 100vh; display: flex; align-items: center; justify-content: center;}

    my english isn't good, sorry🙂

    1
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    Firstly, your solution is very good! My only tip is to use semantic HTML. That way you won't have multiple <div> in your code. This link may help you 😎👍

    • https://developer.mozilla.org/en-US/docs/Glossary/Semantics
    Marked as helpful
    0
  • Thiago Morais•420
    @thirrazPosted about 2 years ago

    Firstly, congratulations for complete the challenge! I would like to give some suggestions for imrove your code:

    • You didn't use flexbox to positioning your elements, if you chose this it's okay, but if you don't know about I'll share this link to you: https://css-tricks.com/snippets/css/a-guide-to-flexbox/ For example: you could align the main section with this: body{ width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center;

    • To have better HTML code, you can use semantic HTML. Instead of using <div class="main" you can use <main> tag

    sorry for my bad english

    Marked as helpful
    1