- different sidebar button icons for expanded, collapsed and hidden sidebar states
- move sidebar-button to beginning of navbar strip, to the left of back button
Differential Revision: https://phabricator.services.mozilla.com/D223406
By only setting display: grid when there are items in the pinned tabs
container, we prevent extra space from appearing at the top of the
sidebar.
Depends on D222659
Differential Revision: https://phabricator.services.mozilla.com/D223232
Also move sidebar padding into tabs from the container, show scrollbar
gutter with non-overlay scrollbars, prevent icon shifting when expanding
the sidebar, avoid cropping tab background shadows.
Co-authored-by: Tim Giles <tgiles@mozilla.com>
Differential Revision: https://phabricator.services.mozilla.com/D222659
Reuse welcome bundle for sidebar onboarding. Add/reuse icons including brands and import-export. Expose onboarding strings for localization.
Differential Revision: https://phabricator.services.mozilla.com/D220155
The main purpose of this patch is to make the visibility of the revert button consistent to make it more accessible. After talking with Josh, we agreed the revert icon should always show in an `invalid` pageproxystate until `userTypedValue` differs from the search string. Doing so will make the Revert button be more predictable for keyboard users instead of hiding it when the input field is focused and then showing it again when they press tab (or not making it focusable at all).
The Go button (the right arrow button) will show up again once the user has modified the search terms. I didn't think this would be much of an issue since the Go arrow is not focusable by keyboard, it's not visible when the address bar is not focused, and "Enter" is a well known shortcut to doing the same function.
This involved checking when `persistsearchterms` was changed to `false` and removing it to instead remove `persistsearchterms` when the search terms changed. This is reflected in the new expected behavior in the tests.
One issue was adding `focus` to the revert button via CSS caused focus issues. Tabbing from the left elements (reload button) to the input would skip the input altogether and go straight to the revert button and then to the Save to Pocket button. Pressing shift + tab to try and go back from the revert button to the input would get stuck in a loop between the input field and revert button. This was fixed with `<toolbartabstop/>` . I created a hideable container to ensure the tabstop only exists when the `persistsearchterms` state is active. And the new test checks that the tab behaviour is consistent.
Lastly, because keyboard users might press the Revert button, focusing the input seemed like a logical choice, or else when the focus is lost the user would need to tab all the way back to the input to do more actions. There is also an initiative to move inline Javascript out from markup.
Differential Revision: https://phabricator.services.mozilla.com/D223423
To address bug 1918686 (tabs within tab groups have incorrect width), we're exploring using display:contents on tab-group elements, and in preparation for that we need to move the tab group line to be inside tab elements instead.
Differential Revision: https://phabricator.services.mozilla.com/D223060
- Registers the a new review checker sidebar using `registerPrefSidebar` that will display if `browser.shopping.experience2023.integratedSidebar` is enabled.
- Hides any open review checker sidebars if the pref changes.
- Adds `reviewchecker` to the sidebar revamp tools pref.
Note: this only adds the sidebar tool, it will not load anything as the actors aren't setup yet.
Differential Revision: https://phabricator.services.mozilla.com/D221362
After the previous patch, we don't jank all remote tabs when resizing
the browser, so this can go. This should also make general window
resizing faster.
Differential Revision: https://phabricator.services.mozilla.com/D221996
After the previous patch, we don't jank all remote tabs when resizing
the browser, so this can go. This should also make general window
resizing faster.
Differential Revision: https://phabricator.services.mozilla.com/D221996
The `orient` attribute should always be set on `#tabbrowser-tabs`, so we can use `[orient="horizontal"]` instead of `:not([orient="vertical"])`.
The `expanded` attribute should be set on `#tabbrowser-tabs` too, so we can use that directly there instead of looking at `sidebar-main`.
Differential Revision: https://phabricator.services.mozilla.com/D222086
