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

Comments

@rebron
Copy link
Collaborator

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

@bsclifton bsclifton changed the title use sidebar navigation for settings, Extensions Display sidebar navigation for Settings and Extensions pages Sep 10, 2018

bsclifton added a commit to bsclifton/brave-core that referenced this issue Sep 11, 2018

First steps towards solving brave/brave-browser#958
Stashing so I can check out another issue

bsclifton added a commit to bsclifton/brave-core that referenced this issue Sep 19, 2018

First steps towards solving brave/brave-browser#958
Stashing so I can check out another issue
@rebron

This comment has been minimized.

Copy link
Collaborator Author

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

This comment has been minimized.

Copy link
Member

commented Sep 21, 2018

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

@bbondy bbondy added this to Settings and chrome:// pages in 1.0 Tasks by Category Sep 29, 2018

bsclifton added a commit to brave/brave-core that referenced this issue Oct 12, 2018

First steps towards solving brave/brave-browser#958
Stashing so I can check out another issue

@bsclifton bsclifton referenced this issue Oct 12, 2018

Closed

WIP: Style updates to Settings #623

5 of 28 tasks complete

bsclifton added a commit to brave/brave-core that referenced this issue Oct 29, 2018

First steps towards solving brave/brave-browser#958
Stashing so I can check out another issue

@bbondy bbondy modified the milestones: 1.0, 1.x Backlog Oct 30, 2018

@rebron rebron added this to Untriaged Backlog in Front End Nov 5, 2018

@rebron rebron moved this from Untriaged Backlog to Prioritized Backlog in Front End Dec 4, 2018

bsclifton added a commit to brave/brave-core that referenced this issue Jan 11, 2019

First steps towards solving brave/brave-browser#958
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 removed this from Settings and chrome:// pages in 1.0 Tasks by Category Jan 15, 2019

@rebron rebron removed this from Prioritized Backlog in Front End Jan 15, 2019

@rebron rebron added this to P3, P4 & P5 backlog in Settings Jan 15, 2019

@rebron rebron moved this from P3, P4 backlog to P1 & P2 Backlog in Settings Jan 15, 2019

@rebron rebron added the priority/P2 label Jan 15, 2019

bsclifton added a commit to brave/brave-core that referenced this issue Jan 16, 2019

First steps towards solving brave/brave-browser#958
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

This comment has been minimized.

Copy link
Member

commented Jan 16, 2019

@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

This comment has been minimized.

Copy link
Collaborator Author

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 added a commit to brave/brave-core that referenced this issue Jan 23, 2019

First steps towards solving brave/brave-browser#958
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 moved this from P1 & P2 Backlog to In progress in Settings Feb 12, 2019

@petemill petemill referenced this issue Mar 12, 2019

Merged

WebUI: Settings & 4 different ways to override #1909

9 of 19 tasks complete

@petemill petemill added the QA/Yes label Mar 19, 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

This comment has been minimized.

Copy link
Member

commented Mar 19, 2019

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

@srirambv

This comment has been minimized.

Copy link
Collaborator

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
You can’t perform that action at this time.