Widget menu for new tabs page elements

[imptrx]

Description

Related issue: #4510
Currently showing and hiding widgets in NTP is available soon via the Dashboard Settings Menu. We should also be able to control these options via opening a "widget" menu that shows up via menu button or right clicking the widget.

Hover or tab over the Brave Stats widget to highlight it and display an icon representing menu options:

Clicking/selecting the icon shows a menu with widget options:

Hover or tab over the Clock widget to highlight it and display an icon representing menu options:

Clicking/selecting the icon shows a menu with widget options:

Hover or tab over the Top Sites widget to highlight it and display an icon representing menu options:

Clicking/selecting the icon shows a menu with widget options:

[imptrx]

Test Plan:
Widget Behaviour

• Hover over widgets should produce a hover effect and an icon beside it
• Clicking on the icon for each widget should open up a menu (clicking again will toggle)
• If menu is open, moving the cursor away from the widget wouldn’t remove the hover effect
• If menu is closed, moving the cursor away from the widget removed hover effects
• If menu is open clicking outside the menu will close the menu and disable toggle
• Clicking remove from each widget menu will remove the widget from the page
• When re-enabling the widget(via the customization menu at the bottom right/left side of page) - widget menu should be closed, no hover effect

Icon placement on hover

• On large screen, widget icon will appear towards the center of the page (away from edge)
• On smaller screens, all widget icon will appear towards the right (or left depending on locale)

[GeetaSarvadnya]

Verification passed on

Brave	0.70.97 Chromium: 77.0.3865.65 (Official Build) beta (64-bit)
Revision	87a331a3169cab563505fb44011058b904011ba1-refs/branch-heads/3865@{#726}
OS	Windows 10 OS Version 1803 (Build 17134.1006)

• Verified the test plan mentioned in Widget menu for new tabs page elements #5015 (comment)
• Logged Remove Dashboard Settings tool tip for each stats #6084 Unnecessary space in Remove button for widget menus in NTP #6085 new tab background image and buttons are not spanned properly when browser window is minimized #6086

[btlechowski]

@kjozwiak This feature is not implemented in 0.69.128. It works well in 0.70.100.

[bsclifton]

Moving milestones to 0.70.x
cc: @cezaraugusto

[kjozwiak]

@bsclifton thanks for moving, was this supposed to be in 0.69.x? Just want to make sure we haven't missed anything important when we did the merge 👍 Maybe @cezaraugusto can comment with more context.

[rebron]

@kjozwiak This issue didn't need to go into 0.69.x. Incremental fixes for new tab page are riding the trains so this fix in 0.70.x.

[LaurenWags]

Verified passed with

Brave	0.70.110 Chromium: 77.0.3865.90 (Official Build) beta (64-bit)
Revision	58c425ba843df2918d9d4b409331972646c393dd-refs/branch-heads/3865@{#830}
OS	macOS Version 10.13.6 (Build 17G5019)

• Verified test plan from Widget menu for new tabs page elements #5015 (comment)

• Per test plan, for small screens, L->R languages (ex. English) menu widget is on Right and for R->L languages (ex. Hebrew) menu widget is on Left.

Verification passed on

Brave	0.70.109 Chromium: 77.0.3865.90 (Official Build) beta (64-bit)
Revision	58c425ba843df2918d9d4b409331972646c393dd-refs/branch-heads/3865@{#830}
OS	Ubuntu 18.04 LTS

• Verified test plan from Widget menu for new tabs page elements #5015 (comment)

High resolution



Low resolution



RTL High resolution



RTL Low resolution