Responsive Flex css

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Fala Alephy, tudo bem? Parabéns pelo desafio!

  Acabei de abrir o preview da sua solução e achei tudo mto bom, tem poucos detalhes pra melhorar. Aqui umas dicas:

  Pra adicionar essas duas imagens de ondinha no topo e na base da página, você pode usar background-image, o melhor jeito seria inserindo no body pra ficar abaixo de todos elementos e adicionar as duas images com background-image: url() com uma virgula pra importar as duas imagens e mudar a posição delas com background-position e colocar a virgula tbm pra manipular a posição. Olha o código abaixo com o as imagens aplicadas:

  main {
      background-image: url(../images/bg-pattern-top-desktop.svg), url(../images/bg-pattern-bottom-desktop.svg);
      background-position: left -185px top -236px, right 10px bottom -300px;
      background-repeat: no-repeat, no-repeat;
      background-attachment: fixed, fixed;
      background-size: contain, contain;
      background-color: hsl(0, 0%, 100%);
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }
  

  👋 Espero ter ajudado e continue no foco!

  0