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

WIP: Style updates to Settings #623

Closed
wants to merge 2 commits into from
Closed

WIP: Style updates to Settings #623

wants to merge 2 commits into from

Conversation

bsclifton
Copy link
Member

@bsclifton bsclifton commented Oct 12, 2018

Current status

This is something I've worked on as time allows. Feel free to grab it and help! Feedback appreciated

This PR is meant to fix:
brave/brave-browser#958
brave/brave-browser#964

And partially addresses:
brave/brave-browser#1222
brave/brave-browser#1186
brave/brave-browser#960
brave/brave-browser#955
brave/brave-browser#26
(and possibly others)

Here's a screenshot showing how it looks at the moment:
screen shot 2018-10-12 at 12 46 41 pm

TODOs

  • Remove the hamburger menu which doesn't work
  • Use correct font (Poppins)
  • Put the icons in the title for each section
  • Add the new shields section to sidebar
  • Wire up the shields link, so it jumps down there (routable URL like chrome://settings/shields)
  • Fix display problem with SVGs (See picture. Was it a bad export maybe?)
  • Create Get Started section and condense appropriate settings there
  • Use same orange header color on Bookmarks page
  • Use same orange header color on History page
  • Use same orange header color on Downloads page

Submitter Checklist:

  • Submitted a ticket for my issue if one did not already exist.
  • Used Github auto-closing keywords in the commit message.
  • Added/updated tests for this change (for new code or code which already has tests).
  • Verified that these changes build without errors on
    • Windows
    • macOS
    • Linux
  • Verified that these changes pass automated tests (npm test brave_unit_tests && npm test brave_browser_tests) on
    • Windows
    • macOS
    • Linux
  • Ran git rebase master (if needed).
  • Ran git rebase -i to squash commits (if needed).
  • Tagged reviewers and labelled the pull request as needed.
  • Request a security/privacy review as needed.
  • Add appropriate QA labels (QA/Yes or QA/No) to include the closed issue in milestone

Test Plan:

Reviewer Checklist:

  • New files have MPL-2.0 license header.
  • Request a security/privacy review as needed.
  • Adequate test coverage exists to prevent regressions
  • Verify test plan is specified in PR before merging to source

@rossmoody
Copy link
Contributor

Did some light CSS and icon render fixes. Latest screen:
image

@bsclifton bsclifton force-pushed the bsc-prefs-sidebar branch 5 times, most recently from af43ddd to f16a26a Compare January 11, 2019 17:14
@bsclifton
Copy link
Member Author

Just finished rebasing this and making sure it works great against master 😄 👍

<dom-module id="settings-icons">
<template>
<style>
-<if expr="chromeos">
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm confused about this patch. This only applies to chromeos

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks like just an indentation thing? I can fix it

<template>
<style include="settings-shared">
:host {
- display: block;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we need to look at other ways to do this, this patch is going to be a nightmare to maintain

@bridiver
Copy link
Collaborator

we definitely need to look at other ways to handle these patches, they are going to be effectively unmaintainable across chromium upgrades

<div id="leftSpacer">
<!-- Note: showing #menuPromo relies on this dom-if being [restamp]. -->
- <template is="dom-if" if="[[showMenu]]" restamp>
+ <!-- <template is="dom-if" if="[[showMenu]]" restamp>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if this is based on showMenu then why don't we just turn off showMenu?

Copy link
Member

@petemill petemill Jan 16, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

showMenu is a function on the prototype for MenuButton, and not a property / variable. So I think we'll have to extend and set to undefined.


AboutHandler* AboutHandler::Create(content::WebUIDataSource* html_source,
Profile* profile) {
+ std::string brave_product_version = version_info::GetVersionNumber();
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe this logic already exists somewhere and if it doesn't it needs to be put in a helper. It definitely doesn't belong here in this patch

bsclifton and others added 2 commits January 16, 2019 11:17
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`
- fixed render issues with current icons
- did some light css but looped in pete and found it might be diminishing return so stopped
- made the top banner a gradient
- rebased against master 2019 Jan 10
@@ -0,0 +1,36 @@
<link rel="import" href="../html/polymer.html">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Leaving a note here to remember to change this path to point at the path in chromium's resources

@Jacalz
Copy link
Contributor

Jacalz commented Jan 19, 2019

Really looking forward to seeing this merged. This looks really promising 👍

@petemill petemill force-pushed the bsc-prefs-sidebar branch 2 times, most recently from 4cd31c8 to a4f1022 Compare January 23, 2019 06:32
@bsclifton
Copy link
Member Author

Closing in favor of the branch @petemill has been working on 😄

@bsclifton bsclifton closed this Feb 14, 2019
@bsclifton bsclifton deleted the bsc-prefs-sidebar branch February 14, 2019 05:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants