loginDialog: Only highlight a single item at any time

The user list uses the same indication for hover and focus, so it
is possible for two items to be highlighted at the same time. Using
different styling would improve the situation, but only to some
extent - the user would still need to figure out which highlight
corresponds to which activation method. So instead, copy the
approach we use in popup menus and use a single property for
highlights that is updated by both focus- and hover changes.

https://bugzilla.gnome.org/show_bug.cgi?id=772284
This commit is contained in:
Florian Müllner 2017-06-09 17:34:43 +02:00
parent 79aa404c14
commit 526f2c8bcf
4 changed files with 22 additions and 9 deletions

View File

@ -1724,7 +1724,7 @@ StScrollBar {
spacing: 12px;
padding: .2em;
width: 23em; }
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
.login-dialog-user-list:expanded .login-dialog-user-list-item:selected {
background-color: #215d9c;
color: #ffffff; }
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
@ -1738,9 +1738,6 @@ StScrollBar {
padding-right: 1em; }
.login-dialog-user-list-item:rtl {
padding-left: 1em; }
.login-dialog-user-list-item:hover {
background-color: #215d9c;
color: #ffffff; }
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
height: 2px;
margin: 2px 0 0 0;

@ -1 +1 @@
Subproject commit 2bef9b25e23632fe66e12c5d96a9c487f172a6a0
Subproject commit 4de529843779532db8e5aa76b4e8a74f163e79c5

View File

@ -1724,7 +1724,7 @@ StScrollBar {
spacing: 12px;
padding: .2em;
width: 23em; }
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
.login-dialog-user-list:expanded .login-dialog-user-list-item:selected {
background-color: #215d9c;
color: #ffffff; }
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
@ -1738,9 +1738,6 @@ StScrollBar {
padding-right: 1em; }
.login-dialog-user-list-item:rtl {
padding-left: 1em; }
.login-dialog-user-list-item:hover {
background-color: #215d9c;
color: #ffffff; }
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
height: 2px;
margin: 2px 0 0 0;

View File

@ -70,6 +70,16 @@ const UserListItem = new Lang.Class({
this.actor.connect('destroy',
Lang.bind(this, this._onDestroy));
this.actor.connect('key-focus-in', () => {
this._setSelected(true);
});
this.actor.connect('key-focus-out', () => {
this._setSelected(false);
});
this.actor.connect('notify::hover', () => {
this._setSelected(this.actor.hover);
});
this._userWidget = new UserWidget.UserWidget(this.user);
layout.add(this._userWidget.actor);
@ -103,6 +113,15 @@ const UserListItem = new Lang.Class({
this.emit('activate');
},
_setSelected: function(selected) {
if (selected) {
this.actor.add_style_pseudo_class('selected');
this.actor.grab_key_focus();
} else {
this.actor.remove_style_pseudo_class('selected');
}
},
showTimedLoginIndicator: function(time) {
let hold = new Batch.Hold();