Merge lp:~mterry/webbrowser-app/less-ubuntucolors into lp:webbrowser-app

[Michael Terry]

Use less hard-coded colors in favor of theme colors.

- We were using some off-brand colors like "green" instead of UbuntuColors.green. Which are now fixed to the theme 'positive' color in this branch anyway.
- We were using a lot of orange in places we shouldn't (mostly for recommended buttons, some selected states, and in one place for a progress indicator).
- We were frequently specifying the color of a neutral button, but never the same way twice (coolGrey, warmGrey, lightGrey). No need, the default button color should be fine.
- And I fixed a few of the instances of UbuntuColors.darkGrey for text to appropriate theme colors.

There are still a lot of UbuntuColor.darkGrey instances sitting out there (which is now more properly called UbuntuColors.slate, or backgroundSecondaryText in the normal theme). And a lot of hardcoded "#xxxxxx"! But I didn't deal with all of it, since I'm not super familiar with the code base.

And I left the "this page is bookmarked" icon fill color as UbuntuColors.orange. That was a unique-enough case that I wasn't sure what would be appropriate there.

[Olivier Tilloy (osomon)]

Those changes look good, thanks Michael for taking some time to apply them. A couple of minor comments:

The OK button in src/app/ConfirmDialog.qml should have an explicit color of theme.palette.normal.positive, for consistency. And probably src/app/AlertDialog.qml too.
Not sure what should be done with src/app/BeforeUnloadDialog.qml.

In the history and bookmarks views (wide layout), the color of the current date/folder in the left column when it doesn’t have active focus should be 'selected.backgroundText' instead of 'normal.positionText', according to https://docs.google.com/presentation/d/1Sgf536u5LgKgl41x7xeEeo-XibEEPQZ_phugEArwvec/edit?ts=5728be0d#slide=id.g12f5d7958f_0_92 (that visual design update hasn’t been implemented yet, I’ll get to it soon, but since you’re changing some colors now, I reckon it would be better to use the updated ones now).

Could you please update the dates in the copyright headers for files that were changed?

[lp:~mterry/webbrowser-app/less-ubuntucolors]

1458. By Michael Terry on 2016-05-23

Add a few more button colors and update copyright years

[Michael Terry (mterry)]

- Made the OK button green in ConfirmDialog and AlertDialog.

- Looking at BeforeUnloadDialog, I thought it made sense to make "Leave" red and keep "Stay" grey. Let me know if you don't like this.

- For the history/bookmark views... at least in the current theme shipped today, selected.backgroundText is the same as normal.backgroundText: UbuntuColors.jet. Maybe that's a bug with the theme...? But I don't think positionText is so wrong. It's supposed to be "applied to navigation elements to indicate current position" (from PaletteValues.qml). And it's the color used in the toolkit's SectionsStyle.qml to indicate which header section is active. So maybe that spec is out of date? I think positionText is a relatively new palette option.

- Updated copyrights.

[Olivier Tilloy (osomon)]

Looks good to me, and your point about positionText makes sense to me.

review: Approve

[system-apps-ci-bot (system-apps-ci-bot)]

PASSED: Continuous integration, rev:1458
https://jenkins.canonical.com/system-apps/job/lp-webbrowser-app-ci/579/
Executed test runs:
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build/950
    SUCCESS: https://jenkins.canonical.com/system-apps/job/test-0-autopkgtest/label=phone-armhf,release=vivid+overlay,testname=default/167
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-0-fetch/950
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-1-sourcepkg/release=vivid+overlay/855
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-1-sourcepkg/release=xenial+overlay/855
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-1-sourcepkg/release=yakkety/855
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=vivid+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=vivid+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=xenial+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=xenial+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=yakkety/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=amd64,release=yakkety/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=vivid+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=vivid+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=xenial+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=xenial+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=yakkety/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=armhf,release=yakkety/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=vivid+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=vivid+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=xenial+overlay/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=xenial+overlay/852/artifact/output/*zip*/output.zip
    SUCCESS: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=yakkety/852
        deb: https://jenkins.canonical.com/system-apps/job/build-2-binpkg/arch=i386,release=yakkety/852/artifact/output/*zip*/output.zip

Click here to trigger a rebuild:
https://jenkins.canonical.com/system-apps/job/lp-webbrowser-app-ci/579/rebuild

review: Approve (continuous-integration)

=== modified file 'src/app/AlertDialog.qml'
--- src/app/AlertDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/AlertDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013-2015 Canonical Ltd.
+ * Copyright 2013-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -24,6 +24,7 @@
 
     Button {
         text: i18n.tr("OK")
+        color: theme.palette.normal.positive
         onClicked: model.accept()
     }
 }

=== modified file 'src/app/AuthenticationDialog.qml'
--- src/app/AuthenticationDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/AuthenticationDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013-2015 Canonical Ltd.
+ * Copyright 2013-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -45,13 +45,12 @@
 
     Button {
         text: i18n.tr("OK")
-        color: "green"
+        color: theme.palette.normal.positive
         onClicked: accept()
     }
 
     Button {
         text: i18n.tr("Cancel")
-        color: UbuntuColors.coolGrey
         onClicked: model.reject()
     }
 

=== modified file 'src/app/BeforeUnloadDialog.qml'
--- src/app/BeforeUnloadDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/BeforeUnloadDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2014-2015 Canonical Ltd.
+ * Copyright 2014-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -24,6 +24,7 @@
 
     Button {
         text: i18n.tr("Leave")
+        color: theme.palette.normal.negative
         onClicked: model.accept()
     }
 

=== modified file 'src/app/CertificateVerificationDialog.qml'
--- src/app/CertificateVerificationDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/CertificateVerificationDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013-2015 Canonical Ltd.
+ * Copyright 2013-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -27,13 +27,13 @@
 
     Button {
         text: i18n.tr("Proceed anyway")
-        color: "red"
+        color: theme.palette.normal.negative
         onClicked: model.accept()
     }
 
     Button {
         text: i18n.tr("Back to safety")
-        color: "green"
+        color: theme.palette.normal.positive
         onClicked: model.reject()
     }
 

=== modified file 'src/app/ConfirmDialog.qml'
--- src/app/ConfirmDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/ConfirmDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013-2015 Canonical Ltd.
+ * Copyright 2013-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -24,6 +24,7 @@
 
     Button {
         text: i18n.tr("OK")
+        color: theme.palette.normal.positive
         onClicked: model.accept()
     }
 

=== modified file 'src/app/GeolocationPermissionRequest.qml'
--- src/app/GeolocationPermissionRequest.qml	2015-09-29 13:09:26 +0000
+++ src/app/GeolocationPermissionRequest.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2014-2015 Canonical Ltd.
+ * Copyright 2014-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -31,7 +31,6 @@
     Button {
         objectName: "deny"
         text: i18n.tr("Deny")
-        color: UbuntuColors.warmGrey
         onClicked: {
             request.deny()
             PopupUtils.close(dialog)
@@ -41,7 +40,7 @@
     Button {
         objectName: "allow"
         text: i18n.tr("Allow")
-        color: UbuntuColors.orange
+        color: theme.palette.normal.positive
         onClicked: {
             request.allow()
             PopupUtils.close(dialog)

=== modified file 'src/app/HttpAuthenticationDialog.qml'
--- src/app/HttpAuthenticationDialog.qml	2015-08-12 16:11:24 +0000
+++ src/app/HttpAuthenticationDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Canonical Ltd.
+ * Copyright 2015-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -57,7 +57,7 @@
     Button {
         objectName: "allow"
         text: i18n.tr("OK")
-        color: UbuntuColors.green
+        color: theme.palette.normal.positive
         onClicked: {
             request.allow(usernameInput.text, passwordInput.text)
             PopupUtils.close(dialog)
@@ -67,7 +67,6 @@
     Button {
         objectName: "deny"
         text: i18n.tr("Cancel")
-        color: UbuntuColors.coolGrey
         onClicked: {
             request.deny()
             PopupUtils.close(dialog)

=== modified file 'src/app/InvalidCertificateErrorSheet.qml'
--- src/app/InvalidCertificateErrorSheet.qml	2015-08-10 15:22:00 +0000
+++ src/app/InvalidCertificateErrorSheet.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2014-2015 Canonical Ltd.
+ * Copyright 2014-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -175,7 +175,7 @@
                     certificateError.deny()
                     denied()
                 }
-                color: UbuntuColors.orange
+                color: theme.palette.normal.positive
             }
         }
     }

=== modified file 'src/app/MediaAccessDialog.qml'
--- src/app/MediaAccessDialog.qml	2016-04-08 17:05:47 +0000
+++ src/app/MediaAccessDialog.qml	2016-05-23 13:25:57 +0000
@@ -70,7 +70,7 @@
         Button {
             objectName: "mediaAccessDialog.allowButton"
             text: i18n.tr("Yes")
-            color: UbuntuColors.green
+            color: theme.palette.normal.positive
             width: units.gu(10)
             onClicked: {
                 request.allow()
@@ -81,7 +81,6 @@
         Button {
             objectName: "mediaAccessDialog.denyButton"
             text: i18n.tr("No")
-            color: UbuntuColors.lightGrey
             width: units.gu(10)
             onClicked: {
                 request.deny()

=== modified file 'src/app/PromptDialog.qml'
--- src/app/PromptDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/PromptDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013-2015 Canonical Ltd.
+ * Copyright 2013-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -30,13 +30,12 @@
 
     Button {
         text: i18n.tr("OK")
-        color: "green"
+        color: theme.palette.normal.positive
         onClicked: model.accept(input.text)
     }
 
     Button {
         text: i18n.tr("Cancel")
-        color: UbuntuColors.coolGrey
         onClicked: model.reject()
     }
 

=== modified file 'src/app/webbrowser/BookmarkOptions.qml'
--- src/app/webbrowser/BookmarkOptions.qml	2016-02-17 18:27:31 +0000
+++ src/app/webbrowser/BookmarkOptions.qml	2016-05-23 13:25:57 +0000
@@ -99,7 +99,7 @@
                 objectName: "bookmarkOptions.okButton"
                 anchors.right: parent.right
                 text: i18n.tr("OK")
-                color: UbuntuColors.green
+                color: theme.palette.normal.positive
                 onClicked: bookmarkOptions.destroy()
             }
         }
@@ -152,7 +152,7 @@
                 }
                 text: i18n.tr("Save")
                 enabled: folderTextField.text
-                color: UbuntuColors.green
+                color: theme.palette.normal.positive
                 // Button took focus on press what makes the keyboard be
                 // dismissed and that could make the Button moves between the
                 // press and the release. Button onClicked is not triggered

=== modified file 'src/app/webbrowser/BookmarksFoldersViewWide.qml'
--- src/app/webbrowser/BookmarksFoldersViewWide.qml	2016-04-15 11:27:13 +0000
+++ src/app/webbrowser/BookmarksFoldersViewWide.qml	2016-05-23 13:25:57 +0000
@@ -90,7 +90,7 @@
             readonly property bool isAllBookmarksFolder: folder.length === 0
             readonly property bool isCurrentDropTarget: dropArea.containsDrag && dropArea.drag.source.folder !== folder
 
-            color: isCurrentDropTarget ? "green" : "transparent"
+            color: isCurrentDropTarget ? theme.palette.normal.positive : "transparent"
 
             Label {
                 anchors {
@@ -103,7 +103,7 @@
 
                 fontSize: "small"
                 text: isAllBookmarksFolder ? i18n.tr("All Bookmarks") : folderItem.name
-                color: (isActiveFolder && !folders.activeFocus) ? UbuntuColors.orange : UbuntuColors.darkGrey
+                color: (isActiveFolder && !folders.activeFocus) ? theme.palette.normal.positionText : theme.palette.normal.backgroundSecondaryText
             }
 
             onClicked: folders.currentIndex = index

=== modified file 'src/app/webbrowser/DownloadDelegate.qml'
--- src/app/webbrowser/DownloadDelegate.qml	2016-02-01 12:06:20 +0000
+++ src/app/webbrowser/DownloadDelegate.qml	2016-05-23 13:25:57 +0000
@@ -145,7 +145,7 @@
                         height: width
                         anchors.verticalCenter: parent.verticalCenter
                         name: "dialog-warning-symbolic"
-                        color: UbuntuColors.red
+                        color: theme.palette.normal.negative
                     }
 
                     Label {
@@ -154,7 +154,7 @@
                         anchors.leftMargin: units.gu(1)
                         anchors.verticalCenter: errorIcon.verticalCenter
                         fontSize: "x-small"
-                        color: UbuntuColors.red
+                        color: theme.palette.normal.negative
                         text: errorMessage !== "" ? errorMessage 
                                                   : (incomplete && download === undefined) ? i18n.tr("Download failed") 
                                                                                            : ""

=== modified file 'src/app/webbrowser/HistorySectionDelegate.qml'
--- src/app/webbrowser/HistorySectionDelegate.qml	2015-08-11 14:56:25 +0000
+++ src/app/webbrowser/HistorySectionDelegate.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2014-2015 Canonical Ltd.
+ * Copyright 2014-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -52,7 +52,7 @@
         }
 
         fontSize: "small"
-        color: UbuntuColors.darkGrey
+        color: theme.palette.normal.backgroundSecondaryText
     }
 
     ListItem.ThinDivider {

=== modified file 'src/app/webbrowser/HistoryViewWide.qml'
--- src/app/webbrowser/HistoryViewWide.qml	2016-05-05 11:11:01 +0000
+++ src/app/webbrowser/HistoryViewWide.qml	2016-05-23 13:25:57 +0000
@@ -254,7 +254,7 @@
                         }
 
                         fontSize: "small"
-                        color: (!lastVisitDateListView.activeFocus && lastVisitDateDelegate.ListView.isCurrentItem) ? UbuntuColors.orange : UbuntuColors.darkGrey
+                        color: (!lastVisitDateListView.activeFocus && lastVisitDateDelegate.ListView.isCurrentItem) ? theme.palette.normal.positionText : theme.palette.normal.backgroundSecondaryText
                     }
 
                     onClicked: ListView.view.currentIndex = index

=== modified file 'src/app/webbrowser/IndeterminateProgressBar.qml'
--- src/app/webbrowser/IndeterminateProgressBar.qml	2015-10-01 11:33:36 +0000
+++ src/app/webbrowser/IndeterminateProgressBar.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Canonical Ltd.
+ * Copyright 2015-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -35,7 +35,7 @@
         anchors.left: parent.left
         anchors.leftMargin: 0
         anchors.top: parent.top
-        color: UbuntuColors.orange
+        color: theme.palette.normal.activity
         width: indeterminateProgress ? parent.width / 6 : (progress / 100) * parent.width
 
         SequentialAnimation {

=== modified file 'src/app/webbrowser/LeavePrivateModeDialog.qml'
--- src/app/webbrowser/LeavePrivateModeDialog.qml	2015-08-10 15:22:00 +0000
+++ src/app/webbrowser/LeavePrivateModeDialog.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Canonical Ltd.
+ * Copyright 2015-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -37,7 +37,7 @@
         objectName: "leavePrivateModeDialog.okButton"
         anchors { left: parent.left; right: parent.right }
         text: i18n.tr("OK")
-        color: UbuntuColors.green
+        color: theme.palette.normal.positive
         onClicked: okButtonClicked()
     }
 }

=== modified file 'src/app/webbrowser/SadTab.qml'
--- src/app/webbrowser/SadTab.qml	2015-09-29 19:31:47 +0000
+++ src/app/webbrowser/SadTab.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Canonical Ltd.
+ * Copyright 2015-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -84,7 +84,7 @@
             Button {
                 objectName: "reloadButton"
                 text: i18n.tr("Reload")
-                color: UbuntuColors.green
+                color: theme.palette.normal.positive
                 onClicked: webview.reload()
             }
         }

=== modified file 'src/app/webbrowser/SettingsPage.qml'
--- src/app/webbrowser/SettingsPage.qml	2016-05-04 10:30:57 +0000
+++ src/app/webbrowser/SettingsPage.qml	2016-05-23 13:25:57 +0000
@@ -263,7 +263,7 @@
                                 objectName: "privacyConfirmDialog.confirmButton"
                                 width: (parent.width - parent.spacing) / 2
                                 text: i18n.tr("Clear")
-                                color: UbuntuColors.green
+                                color: theme.palette.normal.positive
                                 onClicked: {
                                     confirmed()
                                     PopupUtils.close(privacyConfirmDialog)

=== modified file 'src/app/webbrowser/UrlDelegate.qml'
--- src/app/webbrowser/UrlDelegate.qml	2016-03-01 11:22:35 +0000
+++ src/app/webbrowser/UrlDelegate.qml	2016-05-23 13:25:57 +0000
@@ -68,7 +68,7 @@
                     right: parent.right
                 }
                 fontSize: "x-small"
-                color: UbuntuColors.darkGrey
+                color: theme.palette.normal.backgroundSecondaryText
                 wrapMode: Text.Wrap
                 elide: Text.ElideRight
                 maximumLineCount: 1
@@ -81,7 +81,7 @@
                     right: parent.right
                 }
                 fontSize: "xx-small"
-                color: UbuntuColors.darkGrey
+                color: theme.palette.normal.backgroundTertiaryText
                 wrapMode: Text.Wrap
                 elide: Text.ElideRight
                 maximumLineCount: 1

=== modified file 'src/app/webbrowser/UrlDelegateWide.qml'
--- src/app/webbrowser/UrlDelegateWide.qml	2016-01-28 16:48:27 +0000
+++ src/app/webbrowser/UrlDelegateWide.qml	2016-05-23 13:25:57 +0000
@@ -54,7 +54,7 @@
             id: title
 
             fontSize: "x-small"
-            color: UbuntuColors.darkGrey
+            color: theme.palette.normal.backgroundSecondaryText
             wrapMode: Text.Wrap
             elide: Text.ElideRight
             maximumLineCount: 1
@@ -64,7 +64,7 @@
             id: url
 
             fontSize: "xx-small"
-            color: UbuntuColors.darkGrey
+            color: theme.palette.normal.backgroundTertiaryText
             wrapMode: Text.Wrap
             elide: Text.ElideRight
             maximumLineCount: 1

=== modified file 'src/app/webcontainer/SadPage.qml'
--- src/app/webcontainer/SadPage.qml	2015-09-29 20:14:51 +0000
+++ src/app/webcontainer/SadPage.qml	2016-05-23 13:25:57 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Canonical Ltd.
+ * Copyright 2015-2016 Canonical Ltd.
  *
  * This file is part of webbrowser-app.
  *
@@ -49,7 +49,7 @@
             anchors.horizontalCenter: parent.horizontalCenter
             objectName: "reloadButton"
             text: i18n.tr("Reload")
-            color: UbuntuColors.green
+            color: theme.palette.normal.positive
             onClicked: webview.reload()
         }
     }