The vertical layout of tracers as well as The left menu of algorithms needs a Scrollbar about algorithm-visualizer HOT 15 CLOSED

Oh you’re right I’ll work on that.

from algorithm-visualizer.

Hi, I'm new to open source and would love to help, could I try to work on this? I see the algorithm menu on the left, but what is the vertical layout of tracers?

from algorithm-visualizer.

the middle part where the Tracers(graph 1dArry ,console etc) are displayed.
ok ,Visualization viewer.

from algorithm-visualizer.

also The scroll bar does not match with the color and design of the page..it would be better if the scroll bar is smaller in width and match with the black background

from algorithm-visualizer.

Actually looking at it again, it looks like it has the same design as the scroll bar in the code window. When you mouse over the scroll bar, the gray background appears and it makes the scrollbar wider. It's just a little weird in the tracer windows because of the ability to zoom in and out by scrolling. That makes it so that you have to mouse over the scrollbar, but it does follow the same design as the other scrollbar.

from algorithm-visualizer.

Hi @ALMerrill and @sandeepsj,

I looked into the pull request (#250) regarding this issue, and I believe we don't need overflow-y : auto; on .navigator as .algorithm_list inside of it is already scrollable.

Also, I am not sure why we need a scrollbar for .visualization_viewer and .wrapper. LogTracer already has a vertical scrollbar, and all the other tracers use scrolling to zoom and dragging to pan.

from algorithm-visualizer.

Oh gotcha, I see now that the LogTracer is able to scroll as it has overflow. However, I don't see how the algorithm list can scroll, it doesn't seem to be able to. Nor does the Markdown file on the home screen.

from algorithm-visualizer.

Oops, that sounds like a problem. Would you provide which browser and OS are you using? Also, is a mouse connected?

from algorithm-visualizer.

I'm on MacOS in Firefox. I actually just tried it on Chrome and it looks like the algorithm list does scroll, but the Markdown still does not. However, I also now see that the style of the scroll bars are different in Firefox, so maybe that's what @sandeepsj was saying about the style before. Sorry, now I see why I was so confused.
Also this is true with a mouse or just the touch pad.

from algorithm-visualizer.

Things works perfect in chrome .. but I was using edge.

from algorithm-visualizer.

It seems like working on both Chrome and Safari after adding min-height: 0 to .visualization_viewer, .renderer, and .navigator. Can you guys check if it works on yours too?

from algorithm-visualizer.

Looks like that works great. It even makes everything work in Firefox as well.

from algorithm-visualizer.

Only thing in Firefox is that the scrollbars are a much lighter gray, not matching the style as well

from algorithm-visualizer.

Another problem in Firefox is that it ignores the bottom padding when it overflows. 🤔

from algorithm-visualizer.

Another problem in Firefox is that it ignores the bottom padding when it overflows. 🤔

This says that you can add .log:after { content: ""; height: 24px; display: block; }. That seems to fix the issue in Firefox and leaves it the same in Chrome and Safari

from algorithm-visualizer.