@DylandeBruijn
Posted
Hi Sarah,
Great job on your solution, it looks very close to the design. Nice use of CSS variables and reusable classes. I like that you used a lot of semantic HTML as well.
May I ask what the fear was that you overcame?
A bit of feedback:
-
On mobile you could add a bit more spacing at the bottom of the recipe card. The bottom of the table gets cut off a bit.
-
There are some leftover comments in your code which you could remove.
-
At the moment you are importing your CSS in your JS file and linking that file in your HTML. You could get rid of your JS file and link your CSS file directly in your HTML like this:
<head>
<link rel="stylesheet" href="src/css/main.css">
</head>
- I see you separated your CSS in multiple CSS files, at the moment they get compiled into one CSS file because Vite handles this. If you like this practice I suggest something like SASS.
I hope you find this feedback useful!
Marked as helpful
@AutumnsCode
Posted
@DylandeBruijn I honestly don't know what exactly was my fear in regards to table had been, maybe i felt a little overwhelmed.
I applied your suggestion to my solution, and it should be fixed by now. With the js-file, I had been testing it and forgot to change it back. In regards to SCSS, I have been using SCSS in the past, but since nesting is available in native css too, I don't really see the point in using this for small project like this.
Best regards, Sarah