search

wiktoriavh / learn-web-dev

A Single Page with ressources to learn Web Development from Scratch
learn-web-dev.vercel.app
4 stars 4 forks source link

Feature/Add table of contents #8

Closed Mafrans closed 2 years ago

Mafrans commented 2 years ago

A component like this could be useful to easier navigate the page, especially if it increases in scale in the future. image image

vercel[bot] commented 2 years ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
learn-web-dev ✅ Ready (Inspect) Visit Preview Jul 2, 2022 at 4:07PM (UTC)
wiktoriavh commented 2 years ago

Thanks for that, here are some suggestions to fix it:

To follow the style with the rest of the page, it should say "Table of Contents" instead of "Table of contents", capitalising Nouns basically.

The animation of opening and closing it is nice, but it jumps a lot around and it also changes the widht, this needs to be fixed.

And if possible, when opening the details page, it should be a smooth opening transition, similar to this: https://codepen.io/raubaca/pen/PZzpVe

I am unsure what would be better, being able to open them all and leaving them open or closing the others when opening another. 🤔 same with having the ToC on the right side of the screen. AB-Testing would be useful for this. I would say for one do it as you did by closing the others.

Thanks!

Mafrans commented 2 years ago

Frankly I don't think this is all that much better, and the code is considerably less clean. Peek 2022-06-21 13-50 You decide, I personally don't feel like it fits the theme of the website very well.

wiktoriavh commented 2 years ago

@Mafrans I fixed some variable names, where you only used a single letter. For the future it is better to have a full name for the variable, so we know what it represents. see ef9b158

I will merge it now, but I believe for the future a ToC similar to this one of Tailwind (https://tailwindcss.com/docs/installation) would be a cleaner approach.