Huddle Landing Page

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello my friend Charmonder, congratulations for you solution, as aways a really good one.

  I've found some issues with the desktop background while it scales down, after width: 1000px; sometimes the background doesn't fill the screen fully. I did some fixes in your code adding some background properties to keep the background always full screen:

  .container {
      background-color: hsl(257, 40%, 49%);
      background-size: cover;
      background-image: url(images/bg-desktop.svg);
      background-repeat: no-repeat;
  }
  

  Note that the h1 heading isn't center aligned due the max-width you've set mobile to keep the heading line break, to do this alignment you need to add some margin in order to keep it center, see the code below:

  h1 {
      margin: 0 auto;
  }
  

  The best way to manage these icons without a need to create the additional rounded border is export the svg as a single element, convert the svg icon into path or use some icon library like bootstrap. I did this challenge and I've used the path method to allow me to do changes to the icon as a single element, if you want to know more here's the link:

  https://stackoverflow.com/questions/68294434/how-to-handle-complex-svg-as-a-single-path-element

  Hope it helps you my friend, and keep it up! You're improving a lots.

  Marked as helpful

  1

  ---

  

  charmonder•260

  @charmonderPosted about 2 years ago

  @correlucas Hi Lucas! Thank you for your comment. I took some time off from coding and just getting back in now. Hope I still remember what I've learned and the great tips you've given me!

  0