2026-09-29

Polished the site by adding smaller styling changes

• Made the navbar use flexbox

• Added the footer to all nested pages as well

• Added new custom backgrounds to each of the pages

• I learned how to use the !important keyword (takes precedence over even inline styling, used it to make the text white for the cake page as the background was black)

• I learned how to make different patterns in the background (stripes, dots, concentric circles, etc)

2026-09-26

Header and footer added + filled out placeholder recipes + flexbox on home page, etc

Changes:

• Added the apple pie recipes + pages
• Filled in ingredient list and recipe step placeholders with real recipes on all pages
• Replaced table on main page with flexbox layout
• Added a global navigation bar including a random recipe button
• Made small spacing (padding and margin) changes around the website
• Added a small footer on the home page

What I learned:

• I practiced using combinators and specificity in css (for example, styling specifically the links inside each list option in the navbar with “.navbar li a {…}”)
• I learned about border box reset (padding and border and included in the assigned width/height, helps elements stay organized the same on the screen even if you increase the padding or border values)
• Practiced adding a navbar and footer and how to make the current page of the navbar highlighted (assign the active class)
• Did a little javascript for the random recipe button (picks a random recipe that is not the current one and navigates to that page)
• Practicing using css shorthand (border: 2px solid black)
• I learned about how margin collapses
• Inline vs block elements
• I learned how to use flexbox

2026-09-21

Styling added to home page and nested pages + added cake page

Changes:

• Changed the fonts and their weights site-wide
• Added the rich chocolate cake recipe + page
• Polished the table on the home page with colors and padding
• Added padding and margins in many areas across the site
• Added a striped background
• Replaced the “Go Back” link with a styled back button
• Added image borders
• customized bullet point type for unordered and ordered lists
• Featured recipe on home page

What I learned:

• I refreshed my memory on the basic css (classes, id, type selector, universal selector)
• I learned how specificity works in css and how it decides what styles take priority
• I learned about combinators
• I learned about list-style-position: inside and used it to place the bullet inside the text box for my unordered and ordered lists
• I learned how to make a striped background with repeating-linear-gradient

Next Steps:

• Adding more styling to the nested recipe pages
• Add the remaining 2 recipes to replace placeholders
• Filling in the ingredients and steps on the recipe pages

2026-09-17

Basic site html home page + recipe specfic pages

Changes:

• Added in the headers and descriptions on the home page
• Added in an image for each recipe
• Placed the recipe preview cards inside a table
• Linked the cards to their respective recipe pages
• Created recipe pages with placeholder lists for ingredients and recipe steps, and a return to home link

What I learned:

• I refreshed my memory on the basic html structure as well as common tags
• I learned how to make unordered and ordered lists (as I did for my ingredients and steps respectively)
• I learned how to link to different pages within the site with tags (for example, the back link on each recipe page)
• I learned how to add images with a defined width without squishing/stretching them
• How to add a table (as i did to hold the recipe cards on the home page)

Next Steps:

• Adding css (styling) so it looks better
• Replacing the bottom 3 placeholder recipes with 3 more ones
• Filling in the ingredients and steps on the recipe pages