On Sun, Jul 11, 2021 at 6:04 PM Daniel Sahlberg
<daniel.l.sahlb...@gmail.com> wrote:
>
> Den sön 11 juli 2021 kl 17:53 skrev Nathan Hartman <hartman.nat...@gmail.com>:
>>
>> One slight issue: It seems the viewport is set just *slightly* too
>> wide, at least on my device. This causes a little bit of unwanted
>> left/right scroll.
>>
>> In landscape orientation it is barely discernible (but it's there).
>>
>> In portrait orientation, a few pixels are cut off the right edge (but
>> can be scrolled horizontally into view).
>>
>> How many pixels? I think 8. I think it's caused by style/site.css,
>> where "#site-banner" has a padding of 8px. (Though there may be other
>> paddings that contribute.)
>
>
> It was actually 7 pixels, caused by a padding in the site-nav <div>. I've
> moved it to the site-nav-menu in r1891461. It has the side effect that the
> hamburger is slightly closer to the left edge but I think it is acceptable.
>
>>
>> Why I think so: At the top of the page, the ASF banner, which appears
>> above the Subversion banner, seems to have the final N cut off from
>> the word "FOUNDATION" so that it appears to read "FOUNDATIO" until the
>> screen is scrolled slightly sideways. At first I thought it was caused
>> by the banner being too wide. But then I noticed that the viewport is
>> a little too wide in landscape orientation too, even though the banner
>> is narrower than the viewport in that orientation. Then I noticed that
>> the little gray gradient under the banners seems to have this extra
>> white padding on its right edge (so the blue "border-top" of
>> #site-content, and beneath it, the green "border-top" of #site-nav,
>> are wider than the #site-banner gradient) and that seems to be the
>> exact amount of unwanted scroll.
>
>
> The ASF logo <img> contained an explicit size which broke the CSS media
> queries. I've removed it in r1891462. Looks much better now.
These fixes have solved that issue; however pages that have
<pre>...</pre> formatted text cause the viewport to stretch when the
lines of text are longer than can fit in the viewport. On some pages
there are some quite long lines of preformatted text. Adding a
"overflow-x: auto;" to the CSS for pre tags in site.css seems to fix
it without affecting readability: It allows the pre tag itself to
scroll if needed, but the rest of the page stays put; e.g.,:
[[[
Index: style/site.css
===================================================================
--- style/site.css (revision 1891484)
+++ style/site.css (working copy)
@@ -54,6 +54,7 @@ pre {
padding: 0.25em;
margin: 0 2em;
font-size: 90%;
+ overflow-x: auto;
}
/*
]]]
Cheers,
Nathan
