on xenial help sign in
Fix notifications with the new UITK color schemes Fixes: #1554616, #1556523

Approved by: Michael Terry

commitbe0e5045b493127946d393f1c9c5922df1282a9d authorLukáš Tinkl <lukas.tinkl@canonical.com> dateFri 18 Mar 2016, 17:12 (11 years ago) parent7999aea16922ce
5 files changed+27−25
qml/Notifications/Notification.qml+10−16 qml/Notifications/Notifications.qml+2 qml/Notifications/OptionToggle.qml+1−1 qml/Shell.qml+1 tests/qmltests/Notifications/tst_Notifications.qml+13−8
qml/Notifications/Notification.qml+10−16
@@ -41,15 +41,12 @@ StyledItem {
4141 property int maxHeight
4242 property int margins
4343 readonly property bool draggable: (type === Notification.SnapDecision && state === "contracted") || type === Notification.Interactive || type === Notification.Ephemeral
44− readonly property bool darkOnBright: panel.indicators.shown || type === Notification.SnapDecision
45− readonly property color red: "#fc4949"
46− readonly property color green: "#3fb24f"
44+ readonly property bool darkOnBright: inverseMode || type === Notification.SnapDecision
4745 readonly property color sdLightGrey: "#eaeaea"
48− readonly property color sdDarkGrey: "#dddddd"
49− readonly property color sdFontColor: "#5d5d5d"
5046 readonly property real contentSpacing: units.gu(2)
5147 readonly property bool canBeClosed: type === Notification.Ephemeral
5248 property bool hasMouse
49+ property bool inverseMode
5350 property url background: ""
5451
5552 objectName: "background"
@@ -59,7 +56,7 @@ StyledItem {
5956 opacity: 1 - (x / notification.width) // FIXME: non-zero initially because of LP: #1354406 workaround, we want this to start at 0 upon creation eventually
6057
6158 theme: ThemeSettings {
62− name: "Ubuntu.Components.Themes.Ambiance"
59+ name: darkOnBright ? "Ubuntu.Components.Themes.Ambiance" : "Ubuntu.Components.Themes.SuruDark"
6360 }
6461
6562 state: {
@@ -285,7 +282,6 @@ StyledItem {
285282 }
286283 visible: type !== Notification.Confirmation
287284 fontSize: "medium"
288− color: darkOnBright ? sdFontColor : theme.palette.normal.backgroundText
289285 elide: Text.ElideRight
290286 textFormat: Text.PlainText
291287 }
@@ -300,7 +296,6 @@ StyledItem {
300296 }
301297 visible: body != "" && type !== Notification.Confirmation
302298 fontSize: "small"
303− color: darkOnBright ? sdFontColor : theme.palette.normal.backgroundText
304299 wrapMode: Text.Wrap
305300 maximumLineCount: type == Notification.SnapDecision ? 12 : 2
306301 elide: Text.ElideRight
@@ -341,7 +336,6 @@ StyledItem {
341336 anchors.horizontalCenter: parent.horizontalCenter
342337 visible: type === Notification.Confirmation && body !== ""
343338 fontSize: "medium"
344− color: darkOnBright ? sdFontColor : theme.palette.normal.backgroundText
345339 wrapMode: Text.WordWrap
346340 maximumLineCount: 1
347341 elide: Text.ElideRight
@@ -361,7 +355,7 @@ StyledItem {
361355 }
362356
363357 height: units.gu(1)
364− backgroundColor: darkOnBright ? UbuntuColors.darkGrey : UbuntuColors.lightGrey
358+ backgroundColor: theme.palette.normal.background
365359 aspect: UbuntuShape.Flat
366360 radius: "small"
367361
@@ -370,7 +364,7 @@ StyledItem {
370364 objectName: "innerBar"
371365 width: valueIndicator.width * valueIndicator.value / 100
372366 height: units.gu(1)
373− backgroundColor: notification.hints["x-canonical-value-bar-tint"] === "true" ? UbuntuColors.orange : darkOnBright ? UbuntuColors.lightGrey : "white"
367+ backgroundColor: notification.hints["x-canonical-value-bar-tint"] === "true" ? theme.palette.normal.activity : theme.palette.highlighted.foreground
374368 aspect: UbuntuShape.Flat
375369 radius: "small"
376370 }
@@ -447,7 +441,7 @@ StyledItem {
447441 objectName: "notify_oot_button" + index
448442 width: oneOverTwoCase.width
449443 text: oneOverTwoLoaderTop.actionLabel
450− color: notification.hints["x-canonical-private-affirmative-tint"] == "true" ? green : sdDarkGrey
444+ color: notification.hints["x-canonical-private-affirmative-tint"] == "true" ? UbuntuColors.green : theme.palette.normal.baseText
451445 onClicked: notification.notification.invokeAction(oneOverTwoLoaderTop.actionId)
452446 }
453447 }
@@ -475,7 +469,7 @@ StyledItem {
475469 objectName: "notify_oot_button" + index
476470 width: oneOverTwoCase.width / 2 - spacing * 2
477471 text: oneOverTwoLoaderBottom.actionLabel
478− color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] == "true" ? red : sdDarkGrey
472+ color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] == "true" ? UbuntuColors.red : theme.palette.normal.baseText
479473 onClicked: notification.notification.invokeAction(oneOverTwoLoaderBottom.actionId)
480474 }
481475 }
@@ -536,12 +530,12 @@ StyledItem {
536530 width: buttonRow.width / 2 - spacing * 2
537531 text: loader.actionLabel
538532 color: {
539− var result = sdDarkGrey;
533+ var result = theme.palette.normal.baseText;
540534 if (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] == "true") {
541− result = green;
535+ result = UbuntuColors.green;
542536 }
543537 if (index == 1 && notification.hints["x-canonical-private-rejection-tint"] == "true") {
544− result = red;
538+ result = UbuntuColors.red;
545539 }
546540 return result;
547541 }
qml/Notifications/Notifications.qml+2
@@ -29,6 +29,7 @@ ListView {
2929 property real margin
3030 property bool useModal: snapDecisionProxyModel.count > 0
3131 property bool hasMouse
32+ property bool inverseMode
3233 property url background: ""
3334
3435 UnitySortFilterProxyModel {
@@ -61,6 +62,7 @@ ListView {
6162 maxHeight: notificationList.height
6263 margins: notificationList.margin
6364 hasMouse: notificationList.hasMouse
65+ inverseMode: notificationList.inverseMode
6466 background: notificationList.background
6567
6668 // make sure there's no opacity-difference between the several
qml/Notifications/OptionToggle.qml+1−1
@@ -96,7 +96,7 @@ UbuntuShape {
9696
9797 width: parent.width
9898 text: splitLabel[3]
99− color:"#5d5d5d"
99+ color: theme.palette.normal.backgroundText
100100 fontSize: "small"
101101 maximumLineCount: 1
102102 elide: Text.ElideRight
qml/Shell.qml+1
@@ -663,6 +663,7 @@ Item {
663663 model: NotificationBackend.Model
664664 margin: units.gu(1)
665665 hasMouse: shell.hasMouse
666+ inverseMode: panel.indicators.shown
666667 background: wallpaperResolver.background
667668
668669 y: topmostIsFullscreen ? 0 : panel.panelHeight
tests/qmltests/Notifications/tst_Notifications.qml+13−8
@@ -187,7 +187,8 @@ Item {
187187
188188 anchors.fill: parent
189189 model: mockModel
190− hasMouse: false
190+ hasMouse: fakeMouseCB.checked
191+ inverseMode: inverseModeCB.checked
191192 }
192193 }
193194
@@ -261,19 +262,23 @@ Item {
261262 Layout.fillWidth: true
262263 CheckBox {
263264 id: fakeMouseCB
264− onClicked: {
265− if (checked) {
266− notifications.hasMouse = true;
267− } else {
268− notifications.hasMouse = false;
269− }
270− }
271265 }
272266 Label {
273267 text: "With fake mouse"
274268 anchors.verticalCenter: parent.verticalCenter
275269 }
276270 }
271+
272+ RowLayout {
273+ Layout.fillWidth: true
274+ CheckBox {
275+ id: inverseModeCB
276+ }
277+ Label {
278+ text: "Inverse mode"
279+ anchors.verticalCenter: parent.verticalCenter
280+ }
281+ }
277282 }
278283 }
279284