usnistgov / oscal-tools

Tools for the OSCAL project
https://pages.nist.gov/oscal-tools/
34 stars 17 forks source link

Patching to provide webkit support for icons #29

Closed wendellpiez closed 2 years ago

wendellpiez commented 2 years ago

In case we wish to mitigate the Issue that gives rise to a small but glaring display bug (dropped image icons in Chrome/webkit).

The bug is addressed in https://github.com/uswds/uswds/pull/4404.

wendellpiez commented 2 years ago

The base is apparently not going to provide a -webkit supported value (even while they do elsewhere), instead recommending an Autoprefixer. Opting to patch by hand for now, as this appears to work okay (still testing at commit time).

wendellpiez commented 2 years ago

@iMichaela here is a snapshot of the screen in 'mobile' view, with the bug repaired, in Chrome:

image

wendellpiez commented 2 years ago

@iMichaela - with respect to iPhone display issue, a spinoff Issue would be awesome.

An easy test would be to point the same device with browser to these repositories and check for similar issues:

https://pages.nist.gov/metaschema/ https://pages.nist.gov/hugo-uswds-docs/

(And of course the main OSCAL repository built on the same framework.)

Whether the problem manifests there will help us know where to look / how to duplicate it. (It could be a responsiveness thing for example.) Thanks!

iMichaela commented 2 years ago

@wendellpiez - All listed sites, including OSCAL pages, display the same horizontal black line when scrolling a page. The line appears to be a feature well-positioned when Safari is used, but too high on the lower part of the screen when opened with Chrome. I tested on iPhone 8 and X, the latest iOS: 15.1.

https://user-images.githubusercontent.com/13984545/145660975-09b62172-e2fb-4936-b3a6-ef50aa156ec1.mov

https://user-images.githubusercontent.com/13984545/145660983-409dbee0-d806-4d9b-8347-83545f685abf.mov

Considering this is a more general bug, do you still want me to create an issue in this repository