appDisplay: Show a dot when application is running
Show a dot in the icon of running applications. Design request. https://bugzilla.gnome.org/show_bug.cgi?id=744680
This commit is contained in:
parent
95e141e47e
commit
6cf53a8d1c
@ -492,7 +492,11 @@ StScrollBar {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.dash-item-container > StWidget {
|
||||
padding: 4px 8px;
|
||||
}
|
||||
|
||||
.dash-label { //osd tooltip
|
||||
border-radius: 7px;
|
||||
padding: 4px 12px;
|
||||
@ -539,21 +543,17 @@ StScrollBar {
|
||||
.app-well-app,
|
||||
.show-apps,
|
||||
.grid-search-result {
|
||||
& > .overview-icon {
|
||||
& .overview-icon {
|
||||
@extend %icon_tile;
|
||||
}
|
||||
&.running > .overview-icon {
|
||||
text-shadow: black 0px 2px 2px;
|
||||
}
|
||||
&:active > .overview-icon,
|
||||
&:checked > .overview-icon {
|
||||
&:active .overview-icon,
|
||||
&:checked .overview-icon {
|
||||
background-color: transparentize(darken($osd_bg_color,10%),.1); //FIXME not working?
|
||||
box-shadow: inset 0 1px 2px $osd_borders_color;
|
||||
}
|
||||
&:hover > .overview-icon,
|
||||
&.running:hover > .overview-icon,
|
||||
&:focus > .overview-icon,
|
||||
&:selected > .overview-icon {
|
||||
&:hover .overview-icon,
|
||||
&:focus .overview-icon,
|
||||
&:selected .overview-icon {
|
||||
background-color: transparentize($fg_color,.9);
|
||||
transition-duration: 200ms;
|
||||
border-image: none;
|
||||
@ -561,6 +561,12 @@ StScrollBar {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.app-well-app-running-dot { //running apps indicator
|
||||
width: 10px; height: 3px;
|
||||
background-color: $selected_bg_color;
|
||||
margin-bottom: 2px; //FIXME will happen :)
|
||||
}
|
||||
|
||||
%icon_tile {
|
||||
border-radius: 4px;
|
||||
|
@ -1026,7 +1026,7 @@ StEntry {
|
||||
border-color: #1c1f1f;
|
||||
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
|
||||
selection-background-color: #215d9c;
|
||||
selected-color: white; }
|
||||
selected-color: #ffffff; }
|
||||
StEntry:focus {
|
||||
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
|
||||
border-color: rgba(154, 154, 142, 0.5); }
|
||||
@ -1399,6 +1399,9 @@ StScrollBar {
|
||||
width: 24px;
|
||||
height: 24px; }
|
||||
|
||||
.dash-item-container > StWidget {
|
||||
padding: 4px 8px; }
|
||||
|
||||
.dash-label {
|
||||
border-radius: 7px;
|
||||
padding: 4px 12px;
|
||||
@ -1443,35 +1446,35 @@ StScrollBar {
|
||||
background-color: rgba(238, 238, 236, 0.1);
|
||||
transition-duration: 200ms; }
|
||||
|
||||
.app-well-app.running > .overview-icon,
|
||||
.show-apps.running > .overview-icon,
|
||||
.grid-search-result.running > .overview-icon {
|
||||
text-shadow: black 0px 2px 2px; }
|
||||
.app-well-app:active > .overview-icon, .app-well-app:checked > .overview-icon,
|
||||
.show-apps:active > .overview-icon,
|
||||
.show-apps:checked > .overview-icon,
|
||||
.grid-search-result:active > .overview-icon,
|
||||
.grid-search-result:checked > .overview-icon {
|
||||
.app-well-app:active .overview-icon, .app-well-app:checked .overview-icon,
|
||||
.show-apps:active .overview-icon,
|
||||
.show-apps:checked .overview-icon,
|
||||
.grid-search-result:active .overview-icon,
|
||||
.grid-search-result:checked .overview-icon {
|
||||
background-color: rgba(23, 25, 26, 0.9);
|
||||
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.7); }
|
||||
.app-well-app:hover > .overview-icon, .app-well-app.running:hover > .overview-icon, .app-well-app:focus > .overview-icon, .app-well-app:selected > .overview-icon,
|
||||
.show-apps:hover > .overview-icon,
|
||||
.show-apps.running:hover > .overview-icon,
|
||||
.show-apps:focus > .overview-icon,
|
||||
.show-apps:selected > .overview-icon,
|
||||
.grid-search-result:hover > .overview-icon,
|
||||
.grid-search-result.running:hover > .overview-icon,
|
||||
.grid-search-result:focus > .overview-icon,
|
||||
.grid-search-result:selected > .overview-icon {
|
||||
.app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon,
|
||||
.show-apps:hover .overview-icon,
|
||||
.show-apps:focus .overview-icon,
|
||||
.show-apps:selected .overview-icon,
|
||||
.grid-search-result:hover .overview-icon,
|
||||
.grid-search-result:focus .overview-icon,
|
||||
.grid-search-result:selected .overview-icon {
|
||||
background-color: rgba(238, 238, 236, 0.1);
|
||||
transition-duration: 200ms;
|
||||
border-image: none;
|
||||
background-image: none; }
|
||||
|
||||
.app-well-app-running-dot {
|
||||
width: 10px;
|
||||
height: 3px;
|
||||
background-color: #215d9c;
|
||||
margin-bottom: 2px; }
|
||||
|
||||
.search-provider-icon,
|
||||
.list-search-result, .app-well-app > .overview-icon,
|
||||
.show-apps > .overview-icon,
|
||||
.grid-search-result > .overview-icon {
|
||||
.list-search-result, .app-well-app .overview-icon,
|
||||
.show-apps .overview-icon,
|
||||
.grid-search-result .overview-icon {
|
||||
border-radius: 4px;
|
||||
padding: 6px;
|
||||
border: 1px solid transparent;
|
||||
|
@ -1547,6 +1547,19 @@ const AppIcon = new Lang.Class({
|
||||
can_focus: true,
|
||||
x_fill: true,
|
||||
y_fill: true });
|
||||
|
||||
this._dot = new St.Widget({ style_class: 'app-well-app-running-dot',
|
||||
layout_manager: new Clutter.BinLayout(),
|
||||
x_expand: true, y_expand: true,
|
||||
x_align: Clutter.ActorAlign.CENTER,
|
||||
y_align: Clutter.ActorAlign.END });
|
||||
|
||||
this._iconContainer = new St.Widget({ layout_manager: new Clutter.BinLayout(),
|
||||
x_expand: true, y_expand: true });
|
||||
|
||||
this.actor.set_child(this._iconContainer);
|
||||
this._iconContainer.add_child(this._dot);
|
||||
|
||||
this.actor._delegate = this;
|
||||
|
||||
if (!iconParams)
|
||||
@ -1560,7 +1573,7 @@ const AppIcon = new Lang.Class({
|
||||
iconParams['createIcon'] = Lang.bind(this, this._createIcon);
|
||||
iconParams['setSizeManually'] = true;
|
||||
this.icon = new IconGrid.BaseIcon(app.get_name(), iconParams);
|
||||
this.actor.set_child(this.icon.actor);
|
||||
this._iconContainer.add_child(this.icon.actor);
|
||||
|
||||
this.actor.label_actor = this.icon.label;
|
||||
|
||||
@ -1620,9 +1633,9 @@ const AppIcon = new Lang.Class({
|
||||
|
||||
_updateRunningStyle: function() {
|
||||
if (this.app.state != Shell.AppState.STOPPED)
|
||||
this.actor.add_style_class_name('running');
|
||||
this._dot.show();
|
||||
else
|
||||
this.actor.remove_style_class_name('running');
|
||||
this._dot.hide();
|
||||
},
|
||||
|
||||
_setPopupTimeout: function() {
|
||||
|
Loading…
Reference in New Issue
Block a user