solidjs/solid-site

Confusing right sidebar

Opened this issue · 4 comments

I am not sure if this is an issue or if it is supposed to look like this, but for me is really confusing. Some pages show a right code example that does not make use of the concepts explained in the left part, for example, For component:
https://www.solidjs.com/tutorial/flow_for
image

So on the right side, there is no use of For, neither of the functions cats and setCats. But I see this same pattern on most pages, another example:
https://www.solidjs.com/tutorial/introduction_signals
image

Or is this supposed to be some kind of live tutorial where I should edit the code based on what it is explained on the left side? If so, I think it should be stated more clearly, because I often come to these pages when I google, and I cannot make a lot of sense out of it 🤔

Feel free to close if as I suspect these are live tutorial pages. As mentioned, it was confusing to me when you arrive at some of these pages via a google search, where it is difficult to understand that this is a course of some sort and not a traditional "read-only" tutorial/guide.

Hi @manast thanks for your feedback. This is a really interesting opinion. It's a pattern that other popular frameworks and tutorials use. The truth is we make an assumption when you visit that you recognize the need to press solve at the bottom left.

There's a few things we can do to make this clear. First change Solve to Show Me. We could also put the arrows on the left and the solve button on the right so that it seems more associated with the right hand panel.

Lastly, perhaps we can display a tooltip when you first land on the tutorial. It should pop-up right away and say "To see the solution to this tutorial walk-through, press 'Show Me'.

Do you think that would help make it clearer? :-)

Thanks for taking the time to post this comment.

I think the tooltip would be great, that will make it more obvious for users who land on any of the tutorial pages coming from a google search.

@davedbase The button text change and tooltip addition sound like really good ideas to me. Would it be alright if I tried working on a PR for this issue?