Recipe Page

What are you most proud of, and what would you do differently next time?

I am most proud of making this site tabbable. Since most of this page lacks buttons and links, I used tab indexing for the first time. I decided to make use of a class called tab-target which I then programmatically tab indexed using a tiny bit of JS:

const tabbableElements = document.querySelectorAll('.tab-target');
  tabbableElements.forEach((element) => {
    element.tabIndex = 0;
  });

I just thought this would be fun to try, and make it easier to add additional tabbable elements with little HTML.

What challenges did you encounter, and how did you overcome them?

I ran myself in circles trying to organize my styling. I ran into a few issues with style specificity when trying to apply a variety of different styles to similar elements. I realized in this process what types of selectors override others, and got a better idea of how media queries work in order.

I used this this CSS specificity calculator on a few occasions and ultimately ended up rewriting some funky stuff I had done at the start.

What specific areas of your project would you like help with?

I'm open to any and all criticism. I'm especially curious about how to clean up my CSS a bit, particularly when it comes to making it responsive. It may look different by the time you read it because I'd like to touch it up and refactor it a bit.