Hover effect on results doesn't always work on #14 TV search app.
Check if it is correctly written, maybe a problem with how the event is triggered, or the way the styles are added.

Two rules that are currently not respected: (Rules of ping pong/table tennis)

1. A Game is played to 11 points. A Game must be won by two points.

2. After tied 10-10 (“deuce”), service alternates at every point.

Changes to be made:

If user selects a match to 9 or 11:

• Alternate server every 2 serves
• Must win by 2 points
• When it reaches 10-10 (or 8-8), make the server alternate every serve

If user selects a match to 3 or 5:

• Alternate server every serve
• First to the target score (3 or 5) wins

This should optimise the code, reduce repetition and make it more flexible for future updates (e.g. adding more players if I wanted to adapt it for a different game)

I'll need to move all the current variables linked to player 1 into an object called playerOne, and the same for player 2.

So far it only shows the picture - would like to add:

• Name
• Country
• Link to read more

I would like to set it up so when you hover you see the extra info.

As I'm using the same website for my freelance teaching work, I would like to split the website into a teaching section, with a bit of info about that, and a coding section, which will have the bulk of the site on.

The home page should be very simple with just the two options to select 'teaching' or 'coding' and then also an icon in the navbar to switch between the two. The about page can be the same, I think, maybe with a couple of tweaks. What I'd really like to do is have a different colour scheme for each section, so it's obvious which 'side' of the website you're on.

The teaching homepage can have a short description of what I do, maybe icons of where I've worked, testimonials, and a contact page for people interested in private lessons.

For now, I'll just start with one page for the teaching part. I can use it as an opportunity to try out some nice CSS and JS animations.

I want to keep the same navbar for both 'sides' but perhaps different colour backgrounds.

At the moment I manually add projects to the projects homepage, which was fine while there were ver few, but it's now starting to get difficult to keep up.
My plan is to use JS to write to the DOM, creating cards with the information from an object for each project.
This way when I do a new project I just need to add it to the array of objects and it will be rendered onto the projects page.

When on mobile, you have to tap to show the card details. This would be fine but sometimes if you tap directly where the (hidden) anchor tag is, you go straight to the link without ever showing it.
I need to use a media query to check for 'hover: hover' and apply different rules depending on this.
It looks like I will need to do this in the CSS and change the class only in JavaScript.

Navbar menu doesn't expand on small screens. I think I just forgot to link the script.

Add a loading icon and load all page data at once