Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Display sidebar navigation for Settings page #958

Closed
rebron opened this issue Sep 4, 2018 · 6 comments · Fixed by brave/brave-core#1909
Closed

Display sidebar navigation for Settings page #958

rebron opened this issue Sep 4, 2018 · 6 comments · Fixed by brave/brave-core#1909
Assignees
Labels
about-pages/rebrand Rebranding work on top of Chrome's Polymer-powered pages feature/brave-pages feature/extensions feature/global-settings Settings at browser level independent of shields settings priority/P2 A bad problem. We might uplift this to the next planned release. QA Pass-Linux QA Pass-macOS QA Pass-Win64 QA/Test-Plan-Specified QA/Yes release-notes/include

Comments

@rebron
Copy link
Collaborator

rebron commented Sep 4, 2018

Test plan

  1. Open brave://settings
  2. Sidebar should always be shown (even when scrolling up and down), when the window is wide enough
  3. Clicking items in sidebar should jump to the content
  4. Sidebar should more or less match mockup below

Description

Use persistent sidebar navigation in Settings and Extensions page.
chrome://settings
chrome://extensions (edit by petemill: extensions can be a follow-up, several things to discuss - #3771)

See mock for appearance, order, styling.
Should be:

  • Get Started
  • Extensions
  • Sync
  • Shields
  • Search
  • Appearance

Clicking on links above will take you to the corresponding section on the main screen.

Default collapse -> Additional Settings section.
In order should be:

  • Privacy & Security
  • Passwords & Autofill
  • Languages
  • Downloads
  • Printing
  • Accessibility
  • System
  • Reset

Show Brave logo and About Brave version.

Design

@rebron rebron added this to the 1.0 milestone Sep 4, 2018
@rebron rebron added the feature/global-settings Settings at browser level independent of shields settings label Sep 5, 2018
@bsclifton bsclifton changed the title use sidebar navigation for settings, Extensions Display sidebar navigation for Settings and Extensions pages Sep 10, 2018
@bsclifton bsclifton added feature/brave-pages about-pages/rebrand Rebranding work on top of Chrome's Polymer-powered pages feature/extensions labels Sep 10, 2018
bsclifton added a commit to bsclifton/brave-core that referenced this issue Sep 19, 2018
Stashing so I can check out another issue
@rebron
Copy link
Collaborator Author

rebron commented Sep 20, 2018

For Reset item on the bottom, point onclick to launch into the Reset settings dialog :
reset-mock

Not here: chrome://settings/reset

@bsclifton
Copy link
Member

Making good progress here; for those interested, here are the branches to check out:
https://github.com/brave/brave-core/tree/bsc-prefs-sidebar
https://github.com/brave/brave-browser/tree/bsc-prefs-sidebar

bsclifton added a commit to brave/brave-core that referenced this issue Oct 12, 2018
Stashing so I can check out another issue
bsclifton added a commit to brave/brave-core that referenced this issue Oct 29, 2018
Stashing so I can check out another issue
@bbondy bbondy modified the milestones: 1.0, 1.x Backlog Oct 30, 2018
bsclifton added a commit to brave/brave-core that referenced this issue Jan 11, 2019
Making good progress :)
- `Settings` header added over primary items (and restyled `Advanced` to match)
- Padding and margin appear to match spec
- Specified different font; page needs to be wired to properly include it
- Sidebar has white background + borders with radius
- Colors:
  - active items use `brandBrave` orange and bold the text
  - header incidently is now orange also
  - inactive items use `subtleInteracting`
  - `About Brave` text uses `subtle`
- Product version (ex: 0.55.2) shown under `About Brave` along with a default icon
- `Extensions` moved up under `Settings`
- `Appearance` moved to last item before `Advanced`
@rebron rebron added the priority/P2 A bad problem. We might uplift this to the next planned release. label Jan 15, 2019
bsclifton added a commit to brave/brave-core that referenced this issue Jan 16, 2019
Making good progress :)
- `Settings` header added over primary items (and restyled `Advanced` to match)
- Padding and margin appear to match spec
- Specified different font; page needs to be wired to properly include it
- Sidebar has white background + borders with radius
- Colors:
  - active items use `brandBrave` orange and bold the text
  - header incidently is now orange also
  - inactive items use `subtleInteracting`
  - `About Brave` text uses `subtle`
- Product version (ex: 0.55.2) shown under `About Brave` along with a default icon
- `Extensions` moved up under `Settings`
- `Appearance` moved to last item before `Advanced`
@petemill
Copy link
Member

@rossmoody @bradleyrichter putting 'extensions' as an item in this sidebar makes me uncomfortable since it opens a new page that doesn't have the sidebar, as opposed to every other item, the behavior of which is to scroll the page to the item's section. Should Extensions actually be on the header nav?

@rebron
Copy link
Collaborator Author

rebron commented Jan 16, 2019

@petemill the Extensions link in the sidebar should link to the Extensions section in settings where a user can then go to a new page. Same behavior as with Sync right below it.

Extensions is an item in the sidebar menu for Chrome that points to the external extensions manager page and not in settings.

There are very few access points for Extensions/Extensions manager. Possibly cleaner to have 'Extensions' in the upper nav but we're running out of real estate up there.

petemill pushed a commit to brave/brave-core that referenced this issue Jan 23, 2019
Making good progress :)
- `Settings` header added over primary items (and restyled `Advanced` to match)
- Padding and margin appear to match spec
- Specified different font; page needs to be wired to properly include it
- Sidebar has white background + borders with radius
- Colors:
  - active items use `brandBrave` orange and bold the text
  - header incidently is now orange also
  - inactive items use `subtleInteracting`
  - `About Brave` text uses `subtle`
- Product version (ex: 0.55.2) shown under `About Brave` along with a default icon
- `Extensions` moved up under `Settings`
- `Appearance` moved to last item before `Advanced`
@rebron rebron modified the milestone: 1.x Backlog Feb 7, 2019
@petemill petemill changed the title Display sidebar navigation for Settings and Extensions pages Display sidebar navigation for Settings ~and Extensions pages~ Mar 19, 2019
@petemill petemill changed the title Display sidebar navigation for Settings ~and Extensions pages~ Display sidebar navigation for Settings page Mar 19, 2019
@petemill
Copy link
Member

Reset linking directly to popup covered in another issue @rebron : #3772

@srirambv
Copy link
Contributor

srirambv commented May 27, 2019

Verification passed on

Brave 0.65.107 Chromium: 75.0.3770.38 (Official Build) beta(64-bit)
Revision 3860105745f2b12537da9e9f048f14c3f52ba970-refs/branch-heads/3770@{#618}
OS Linux
  • Side bar navigation is always shown
  • Advanced settings dropdown is hidden by default
  • Clicking on each setting element loads the corresponding section of the settings page

Verification passed on

Brave 0.65.107 Chromium: 75.0.3770.38 (Official Build) beta (64-bit)
Revision 3860105745f2b12537da9e9f048f14c3f52ba970-refs/branch-heads/3770@{#618}
OS Windows 10 OS Version 1803 (Build 17134.523)
  • Side bar navigation is always shown
  • Advanced settings dropdown is hidden by default and can be expanded
  • Clicking on each setting element loads the corresponding section of the settings page

Verification PASSED on macOS 10.14.5 using the following build:

Brave 0.65.112 Chromium: 75.0.3770.38 (Official Build) beta(64-bit)
Revision 3860105745f2b12537da9e9f048f14c3f52ba970-refs/branch-heads/3770@{#618}
OS Mac OS X
  • ensured that clicking on "About Brave" below Additional settings opens chrome://settings/help
  • ensured that the sidebar navigation is always available when accessing settings via several access points
  • ensured that Advanced settings is hidden by default and works as expected when expanded
  • ensured that each item within the sidebar navigation loads the correct sections without issues
  • ensured that the URLs under the omnibox are being updated when switching between each section
  • ensured that the icons are being highlighed orange when clicking on each item

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
about-pages/rebrand Rebranding work on top of Chrome's Polymer-powered pages feature/brave-pages feature/extensions feature/global-settings Settings at browser level independent of shields settings priority/P2 A bad problem. We might uplift this to the next planned release. QA Pass-Linux QA Pass-macOS QA Pass-Win64 QA/Test-Plan-Specified QA/Yes release-notes/include
Projects
None yet
Development

Successfully merging a pull request may close this issue.

8 participants