Update: Solid and gradient colors released in Nightly 1.45.x. The milestone in the issue report indicates it will be available in the Beta 1.44.x release. Version 1.44.x is currently schedule for release S09/27/2022 so won’t be long until available in Release! Brave is still working on NTP/dashboard customizations. So, even more goodies to come!
brave:master ← brave:solid-background-ntp
opened 07:43AM - 06 Jun 22 UTC
Give users an option to set solid color as their background for NTP.
Resolv… es https://github.com/brave/brave-browser/issues/23255
## Submitter Checklist:
- [ ] I confirm that no security/privacy review [is needed](https://github.com/brave/brave-browser/wiki/Security-reviews), or that I have [requested](https://github.com/brave/security/issues/new/choose) one
- [x] There is a [ticket](https://github.com/brave/brave-browser/issues) for my issue
- [x] Used Github [auto-closing keywords](https://docs.github.com/en/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue) in the PR description above
- [x] Wrote a good [PR/commit description](https://google.github.io/eng-practices/review/developer/cl-descriptions.html)
- [ ] Squashed any review feedback or "fixup" commits before merge, so that history is a record of what happened in the repo, not your PR
- [x] Added appropriate labels (`QA/Yes` or `QA/No`; `release-notes/include` or `release-notes/exclude`; `OS/...`) to the associated issue
- [x] Checked the PR locally: `npm run test -- brave_browser_tests`, `npm run test -- brave_unit_tests`, `npm run lint`, `npm run gn_check`, `npm run tslint`
- [ ] Ran `git rebase master` (if needed)
## Reviewer Checklist:
- [ ] A security review [is not needed](https://github.com/brave/brave-browser/wiki/Security-reviews), or a link to one is included in the PR description
- [ ] New files have MPL-2.0 license header
- [ ] Adequate test coverage exists to prevent regressions
- [ ] Major classes, functions and non-trivial code blocks are well-commented
- [ ] Changes in component dependencies are properly reflected in `gn`
- [ ] Code follows the [style guide](https://chromium.googlesource.com/chromium/src/+/HEAD/styleguide/c++/c++.md)
- [ ] Test plan is specified in PR before merging
## After-merge Checklist:
- [ ] The associated issue milestone is set to the smallest version that the
changes has landed on
- [ ] All relevant documentation has been updated, for instance:
- [ ] https://github.com/brave/brave-browser/wiki/Deviations-from-Chromium-(features-we-disable-or-remove)
- [ ] https://github.com/brave/brave-browser/wiki/Proxy-redirected-URLs
- [ ] https://github.com/brave/brave-browser/wiki/Fingerprinting-Protections
- [ ] https://github.com/brave/brave-browser/wiki/Brave%E2%80%99s-Use-of-Referral-Codes
- [ ] https://github.com/brave/brave-browser/wiki/Custom-Headers
- [ ] https://github.com/brave/brave-browser/wiki/Web-Compatibility-Exceptions-in-Brave
- [ ] https://github.com/brave/brave-browser/wiki/QA-Guide
- [ ] https://github.com/brave/brave-browser/wiki/P3A
## Test Plan:
* unit tests : npm run test brave_unit_tests -- --filter=*ViewCounter*
* Manual test:
1. Launch browser with empty profile
2. Click "customize" on right bottom side of NTP
3. Select "Solid colors"
4. Try switching NTP background with solid colors
Related Brave GitHub issue reports:
opened 12:26AM - 13 Apr 21 UTC
feature/new-tab
priority/P3
QA/Yes
release-notes/include
OS/Desktop
retention
## Description
On the new tab page, expose settings to allow users to custom… ize the new tab page with colors, gradients, Brave wallpapers, or their own images that they upload.
## Design and UX
Prototype link: https://www.figma.com/proto/FMuS3IZbzqzQTyRHz42Oix/Desktop-NTP?node-id=1016%3A90&viewport=607%2C480%2C0.1668190062046051&scaling=min-zoom&page-id=1016%3A89
The new feature includes a set of solid colors for users to choose from:
The new feature includes a set of gradients for users to choose from:
### Sponsored images toggle
The sponsored images toggle is at the top level under Customize Dashboard > Background images. Users are able to have sponsored images on/off independently of whether they have their own uploaded background, a Brave background, solid color, or gradient background selected. When the user has Brave Ads off, it will prompt them to "Start using Rewards".
Once clicked, the Rewards onboarding tutorial will show.
When the user visits the sponsored images toggle again, the "Start using Rewards" button will be hidden and it will inform them that they are earning tokens for seeing sponsored images.
### Dark theme
Dark theme is supported:
## Assets
Figma: https://www.figma.com/file/FMuS3IZbzqzQTyRHz42Oix/?node-id=900%3A32768
Some interaction states are not included in the above Figma file because they use our shared Brave button and toggle components. Refer to the component documentation.
- Buttons: https://www.figma.com/file/z9wmg2FCwuXx9FLbDo5avJ/Platform-UI-Brave-desktop?node-id=1011%3A0
- Toggles: https://www.figma.com/file/z9wmg2FCwuXx9FLbDo5avJ/Platform-UI-Brave-desktop?node-id=1051%3A128
## Sub tasks
- [x] [Use custom images for background](https://github.com/brave/brave-browser/issues/19640)
- [ ] Use custom solid/gradient colors for background
- [ ] Improve sponsored images toggle option
- [ ] Support multiple custom images uploading and shuffle randomly(or brave images together)
opened 07:56AM - 15 Jun 18 UTC
feature/new-tab
design
priority/P3
QA/No
release-notes/exclude
OS/Desktop
Currently, a randomly chosen image will as a background and there are "top site"… tiles being shown
Users should have the ability to:
- [x] turn off the background images https://github.com/brave/brave-browser/issues/4523
- [ ] if disabled, user should be able to customize the gradient or have a solid color (https://github.com/brave/brave-browser/issues/15252)
- [x] set your own background image https://github.com/brave/brave-browser/issues/19640
- [x] turn off the "top site" tiles https://github.com/brave/brave-browser/issues/4510
- [x] change the size or number of "top site" tiles being shown https://github.com/brave/brave-browser/issues/6619
- [x] be able to change what opening a new tab does https://github.com/brave/brave-browser/issues/2999
- [x] blank new tab page https://github.com/brave/brave-browser/issues/4509
- [x] Be able to edit and add "top sites" https://github.com/brave/brave-browser/issues/7493
(issue carried over from [browser-laptop](https://github.com/brave/browser-laptop/issues/7159))
1 Like
