This is the first project of The Odin Project. The project tests my html and css abilities to recreate the Google homepage. So far I've relearned how to navigate and create files with the terminal, as well as relearned git commands.

I think I'm getting the hang of css. I'm enjoying it. I need to figure out @Media queries next.

I discovered SvgPathEditor for helping me draw SVGs in html. I tried copying the path from the source code for the apps icon and the magnifying glass icon, but the path seems to not be complete. So I recreated the paths in SvgPathEditor.

I have learned that each browser displays the Google homepage differently:

On Firefox, the font size, color, and margins are slightly different than on Safari and Chrome. It also has a different apps icon- with different hover effect- and Sign in button. Firefox also lacks the top border and a link in the footer that reads, "Carbon neutral since 2007", and the footer is slightly taller. The space between the nav bar and the Google logo is different on Firefox as the page is resized.

On Chrome, the search box is not as wide and it has a microphone icon. While the footer is not fixed to the bottom of the page for a much larger range of window sizes.

On Safari, the Google logo is a lighter shade.