Fix some overflows issues caused by the sticky navigation bar

[wilbowma]

This ensures that the scroll bar starts in the appropriate place, and the background of the border is appropriate when the navtopset is missing

Fixes the issue @rfindler found in #297 after the merge.

[sorawee]

Would it be better to create another container that has the background color, and the div that has scroll bar would simply adjust its margin? Using the border seems very hacky to me.

Also, I think the div that has scroll bar should be lowered a bit. See the below image where the left side is the doc before #297 and the right side is the doc after #297.

[wilbowma]

Adding new divs would require changing the Scribble compilation, which I’m not comfortable messing with.

I’m not sure what you mean about the div being lowered. I agree the left is a change, but I think it’s a change for the better. That white space on the left was wasted anyway as far as I can tell, and now is reserved as a navigation bar.

[sorawee]

I’m not sure what you mean about the div being lowered.

"The Racket References" is too close to "top prev up next"

[wilbowma]

Ohh I see. Yeah could use a little tweaking.

[sorawee]

Left margin box seems to conflict with scrollable TOC.

[wilbowma]

Do you have that scribble file somewhere so I can test?

[rfindler]

@wilbowma I noticed another on regular docs files. This is probably the same thing as @sorawee 's comment but the rectangles around "prev" in this screen shot doesn't seem beautiful.

[wilbowma]

Need to talk to some of the UW folks about how to specify and test the correctness properties, like no overlapping elements.

[sorawee]

@wilbowma the document I showed above should already be installed locally on your computer. raco docs T:demo-s2 should bring it up.

[wilbowma]

How does this look? added a bit of margin and a small border

[wilbowma]

Left margin box seems to conflict with scrollable TOC.

.....

I get a different behaviour:

[wilbowma]

Seems to depend on max-width. At lower max-widths, margin: 0 0 0 0; gets added and pushes it into the body.

[sorawee]

I believe it depends on the width of the window. If I fully maximize the width, I will get the margin note in the TOC area. If I resize the window by reducing the width a bit, I will get the margin note in the content area.

[wilbowma]

Here's how the recent changes look:

[rfindler]

How does this look? added a bit of margin and a small border

This looks great! I like the border. In the screenshot I sent, this was the initial position (and was also the "I have scrolled all the way to the top" position" I believe) and so some extra space is also needed I think. Apologies if that's already addressed elsewhere, just wanted to be clear about what I was trying to report.

[wilbowma]

Hm. I think that has been fixed: https://www.students.cs.ubc.ca/~cs-411/docs/demo-s2/index.html?q=T%3Ademo-s2

[rfindler]

Looks like progress! But I see a small alignment issue:

the box around "up" hangs past the bottom line for me.

[wilbowma]

What browser?

[wilbowma]

Okay, I don't understand how to fix that so I've just removed the border.

[rfindler]

Happens to me in Safari (macOS mojave up to date) and Chrome (also up to date)

[wilbowma]

It shouldn't happen now; I removed the border.

[rfindler]

This is working great for me, thanks @wilbowma !