Focus View (GitHub only)

[jdgarcia]

The signed out and user row (when signed in) UIs have been redone

Focus View only shows up if you have GitHub connected, otherwise it's just a blank screen (for now, next PR will be "connect an integration" UI).

[miggy-e]

Noticed a couple of small things. I also would like it if the focus results were cached, but this can be handled in a separate issue

[gitkrakel]

Layout on Firefox ESR (115.x) is completely broken

Sign-in page

Focus View

(optional) Nits with layout when permissions are requested

Scrollbar in Focus View when permissions are requested

Unnecessary word wrap when cloud and self-hosted are both requested

Other

yarn lint has some warnings you might want to fix.

[jdgarcia]

@gitkrakel well, the good news is that the layout is broken simply because Firefox ESR doesn't support nested CSS. The bad news is I can't use nested CSS which I was happy to be able to use 😢

Scrollbar in Focus View when permissions are requested

That's intentional. The popup has a max height enforced by the browser, and I opted to make the permission banner and the user bar static, and everything else scrollable.

Unnecessary word wrap when cloud and self-hosted are both requested

That's a consequence of the font size and weight used in the Figma design.

[jdgarcia]

@gitkrakel I fixed the Firefox ESR issues. I'll ask Bryce about the permission banner word wrap but that might not get updated til the next PR.

[gitkrakel]

@jdgarcia So I looked into CSS nesting more, and a couple notes:

1. The current Firefox ESR does in fact support nesting, but it's disabled by default. The user needs to go into about:config -> layout.css.nesting.enabled to toggle it on, and then the Focus View seems to work as intended:

2. CSS nesting is enabled by default starting in Firefox 117: https://www.mozilla.org/en-US/firefox/117.0/releasenotes/. Therefore, regular releases of Firefox already support it
3. The next Firefox ESR is 128.0, which comes out in July 2024 (https://whattrainisitnow.com/calendar/).

So if CSS nesting is something you feel strongly about, I think it's fine to compromise and tell Firefox ESR 115 users to enable the about:config flag (they should be a small fraction of the userbase anyway)

[gitkrakel]

Looking good now 👍