Profile Card component usando flex

Community feedback

• 

  raya•2,870

  @rayaattaPosted 10 months ago

  Hello 👋JoaoPaul-S, your solution is awesome 😉.

  The backgrounds can be be a bit confusing 😒 but they are possible.

  Here's how you can get the solution looking closer to the design. Replace

  background-image: url(Images/bg-pattern-bottom.svg);
      background-position: top 380px left 590px;
      background-image: url(Images/bg-pattern-top.svg);
  

  With

    background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
    background-repeat: no-repeat, no-repeat;
    background-position: right 52vw bottom 35vh, left 48vw top 52vh;
  

  To the css for body.

  I hope this helps 🙃

  Happy coding ✌️

  Marked as helpful

  0

  ---

  

  João Paulo•70

  @JoaoPaul-SPosted 10 months ago

  @rayaatta Really quite confusing, I had already tried to include two images in the background in the same property but it didn't work, the whole issue of positioning the background is strange, but this helped a lot. I've already made the necessary modifications, although I think my work on the background it has become more charming lol, really, thank you very much, this will still help me a lot in the future.😊✌

  0

  

  raya•2,870

  @rayaattaPosted 10 months ago

  I am glad I helped@JoaoPaul-S

  0
• 

  Daniel 🛸•44,270

  @danielmrz-devPosted 10 months ago

  Fala @JoaoPaul-S!

  Seu projeto ficou ótimo!

  Esse background com os círculos é um pouco difícil mesmo, mas você pode fazer ele desse jeito aqui:

    background-color: var(--Dark-cyan);
    background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
    background-repeat: no-repeat, no-repeat;
    background-position: right 52vw bottom 35vh, left 48vw top 52vh;
  

  Espero que ajude!

  Fora isso, você fez um ótimo trabalho!

  0