Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • @eniabazaj

    Submitted

    Hi everyone! I had some troubles with the logo in the footer section, I can't understand how to turn it white... Any feedback is appreciated, thank you all!

    Hari Ram 370

    @hariramjp777

    Posted

    Hi Enisa, Your solution looks good. Great 👍

    To change the logo in the footer,

    • Create a new file - logo-footer.svg.
    • Copy the code of logo.svg and paste in logo-footer.svg.
    • Start editing logo-footer.svg. If you look at the code, you'll see kind of markup model,
    <svg>
      <g>
        <path d="" fill=""></path>
        <path d="" fill=""></path>
      </g>
    </svg>
    
    • So, Here you see two path elements inside g element. Among them, One path is for the chat-box like icon and other is for the text "Huddle".

    • Now change the value of fill attribute in the path elements which defines color.

    • So, for first path, fill = "#fafafa" [ for chat-box like icon ]

    • and for second path, fill = "#ffffff" [for text "Huddle"]

    • Finally, update src attribute of <img> in html page.

    Hope it helps.. If you've doubts in the code, ask me in the comments. Have a good day Enisa..

    1
  • @GraciousNgetich

    Submitted

    Hi Guys..this is my first challenge on FrontEnd Mentor and am excited to be part of this amazing community. I need your help in aligning the two cards in the second column to lie on top of each other. Your feedback and comments are welcome!

    Hari Ram 370

    @hariramjp777

    Posted

    Hi @Gracious Ng'etich, Your mobile layout looks good. For desktop layout, you've to use grid with three columns and two rows.

    main {                                                                 /* card container */
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-rows: 1fr 1fr;
    }
    

    and then you set grid-row and grid-column for child elements which specifies number of rows/columns to span.

    You can look at my repository

    Hope it helps. 👍

    0
  • Hari Ram 370

    @hariramjp777

    Posted

    @eniabazaj Great, Everything looks good. Keep it up :thumbsup:

    0
  • Hari Ram 370

    @hariramjp777

    Posted

    Hi @JessicaStrachan, Good Job. Your solution looks good.

    I recommend using width: 90% for profile card and flex-direction: column for footer section when it comes to mobile layouts.

    Happy Coding, :thumbsup:

    0
  • Hari Ram 370

    @hariramjp777

    Posted

    Good. Looks nice :thumbsup:

    0
  • Janet 40

    @janetthieu

    Submitted

    This was my first challenge here! I learned a lot about grid, flex, and media queries.

    My questions:

    • Would there be a more efficient way to create the responsiveness on this site?
    • Are there other things you could suggest to make this site more accessible?

    Any and all critiques are welcome. I'm here to grow and thank you in advance for helping me do so!

    Hari Ram 370

    @hariramjp777

    Posted

    Good 👍

    0
  • Hari Ram 370

    @hariramjp777

    Posted

    Hi @Hortensefrom, Great job, I recommend using a separate div for background and scss variables, imports.

    You can refer my solution, https://github.com/hariramjp777/frontend-fylo-data-storage-component/

    Great work, keep it up :thumbsup:

    0
  • Hari Ram 370

    @hariramjp777

    Posted

    Great work. :thumbsup:

    1
  • Hari Ram 370

    @hariramjp777

    Posted

    Hi, I appreciate your solution.

    I recommend changing the box-shadow of parent container to blue-like color. Use this color #2ab2af

    All the best, great work :thumbsup:

    1
  • Hari Ram 370

    @hariramjp777

    Posted

    Hi Brother, It's a good solution and it's responsive. I recommend the following,

    Add hover effects for cards.

    Second title should be white in dark theme and black in light theme. (Overview - Today)

    section and article must need a heading inside to pass html validation. So, I recommend using div for containers here in this challenge since it'll reduce your html issues.

    All the best, brother..

    1
  • Hari Ram 370

    @hariramjp777

    Posted

    Good solution brother especially using classes for accessibility such as visually-hidden..

    1
  • Hari Ram 370

    @hariramjp777

    Posted

    Hi, Page looks good.

    0