Hello! My name is Dylan Ramos and this is my first HTML & CSS project.

The goal of the project was to recreate the Google homepage as part of the "foundations" course while working through The Odin Project.

I began by creating an html template to build off of. It started with the head of the document, defining the size of the viewport, charset, and the title of the page. I then gathered all of the icons I'd need for the page and kept them in an images folder to call when needed, as well as creating a stylesheet, in which I set a margin and font for the body.

From there, I began working on the top-navigation bar. I created two separate unordered lists with the class "header-nav", one for the two links on the left-side of the navigation bar, and the other for the two links and two icons on the right. I spent a good amount of time on CSS work at this time, such as messing with font-sizes, colors, margins, padding and altering images.

After the top-navigation bar, I worked my way down to the center Google logo and search bar section. After spending a good amount of time figuring out how to apply CSS for the first section, this part came a bit easier. I was able to use flex-columns to work vertically and align everything to the center. This section also came with the addition of buttons and textboxes, which I liked setting up.

Lastly, I added the footer section. This was the easiest part of the project for me, as it was essentially the same as the top-navigation bar, using the same styling, but with a grey background and stuck to the bottom. At the end, I had to do some research and tinkering to get the media queries working properly, as I had no prior experience with them.

Overall, this project was invaluable for my learning. I believe I learn better through projects and actually "doing" than reading or sandbox tutorials. Along with the HTML and CSS practice, this project increased my familiarity with git and the command line, as well as functionality in my IDE.

Thanks for reading, Dylan Ramos [email protected] https://github.com/dylanramos98