diff --git a/data/gnome-shell-theme.gresource.xml b/data/gnome-shell-theme.gresource.xml index 76aeaa579..25769a477 100644 --- a/data/gnome-shell-theme.gresource.xml +++ b/data/gnome-shell-theme.gresource.xml @@ -18,7 +18,6 @@ gnome-shell.css gnome-shell-high-contrast.css logged-in-indicator.svg - more-results.svg no-events.svg no-notifications.svg noise-texture.png diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css index d639e3094..fc16943c5 100644 --- a/data/theme/gnome-shell-high-contrast.css +++ b/data/theme/gnome-shell-high-contrast.css @@ -1189,14 +1189,17 @@ StScrollBar { .list-search-result-description { color: #cacac4; } +.list-search-provider-details { + width: 150px; + color: #e2e2df; + margin-top: 0.24em; } + +.list-search-provider-content { + spacing: 20px; } + .search-provider-icon { padding: 15px; } -.search-provider-icon-more { - width: 16px; - height: 16px; - background-image: url("resource:///org/gnome/shell/theme/more-results.svg"); } - /* DASHBOARD */ #dash { font-size: 9pt; diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass index 6a5935538..07f43e042 160000 --- a/data/theme/gnome-shell-sass +++ b/data/theme/gnome-shell-sass @@ -1 +1 @@ -Subproject commit 6a5935538568835462fa853f746620967d047bcf +Subproject commit 07f43e04251e0daedf2828a5b15c007e8e57fb05 diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 6d5559a2d..e1132c79e 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -1189,14 +1189,17 @@ StScrollBar { .list-search-result-description { color: #cacac4; } +.list-search-provider-details { + width: 150px; + color: #e2e2df; + margin-top: 0.24em; } + +.list-search-provider-content { + spacing: 20px; } + .search-provider-icon { padding: 15px; } -.search-provider-icon-more { - width: 16px; - height: 16px; - background-image: url("resource:///org/gnome/shell/theme/more-results.svg"); } - /* DASHBOARD */ #dash { font-size: 9pt; diff --git a/data/theme/more-results.svg b/data/theme/more-results.svg deleted file mode 100644 index d2fe5f253..000000000 --- a/data/theme/more-results.svg +++ /dev/null @@ -1,114 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - diff --git a/js/ui/search.js b/js/ui/search.js index 0dd4870ff..4f9729ea8 100644 --- a/js/ui/search.js +++ b/js/ui/search.js @@ -102,6 +102,7 @@ const ListSearchResult = new Lang.Class({ y_fill: false, x_align: St.Align.START, y_align: St.Align.MIDDLE }); + this.actor.label_actor = title; if (this.metaInfo['description']) { @@ -189,7 +190,7 @@ const SearchResultsBase = new Lang.Class({ Main.overview.toggle(); }, - _setMoreIconVisible: function(visible) { + _setMoreCount: function(count) { }, _ensureResultActors: function(results, callback) { @@ -240,7 +241,7 @@ const SearchResultsBase = new Lang.Class({ } else { let maxResults = this._getMaxDisplayedResults(); let results = this.provider.filterResults(providerResults, maxResults); - let hasMoreResults = results.length < providerResults.length; + let moreCount = Math.max(providerResults.length - results.length, 0); this._ensureResultActors(results, Lang.bind(this, function(successful) { if (!successful) { @@ -257,7 +258,7 @@ const SearchResultsBase = new Lang.Class({ results.forEach(Lang.bind(this, function(resultId) { this._addItem(this._resultDisplays[resultId]); })); - this._setMoreIconVisible(hasMoreResults && this.provider.canLaunchSearch); + this._setMoreCount(this.provider.canLaunchSearch ? moreCount : 0); this.actor.show(); callback(); })); @@ -273,16 +274,16 @@ const ListSearchResults = new Lang.Class({ this.parent(provider); this._container = new St.BoxLayout({ style_class: 'search-section-content' }); - this.providerIcon = new ProviderIcon(provider); - this.providerIcon.connect('key-focus-in', Lang.bind(this, this._keyFocusIn)); - this.providerIcon.connect('clicked', Lang.bind(this, + this.providerInfo = new ProviderInfo(provider); + this.providerInfo.connect('key-focus-in', Lang.bind(this, this._keyFocusIn)); + this.providerInfo.connect('clicked', Lang.bind(this, function() { - this.providerIcon.animateLaunch(); + this.providerInfo.animateLaunch(); provider.launchSearch(this._terms); Main.overview.toggle(); })); - this._container.add(this.providerIcon, { x_fill: false, + this._container.add(this.providerInfo, { x_fill: false, y_fill: false, x_align: St.Align.START, y_align: St.Align.START }); @@ -294,8 +295,8 @@ const ListSearchResults = new Lang.Class({ this._resultDisplayBin.set_child(this._container); }, - _setMoreIconVisible: function(visible) { - this.providerIcon.moreIcon.visible = visible; + _setMoreCount: function(count) { + this.providerInfo.setMoreCount(count); }, _getMaxDisplayedResults: function() { @@ -679,8 +680,8 @@ const SearchResults = new Lang.Class({ } }); -const ProviderIcon = new Lang.Class({ - Name: 'ProviderIcon', +const ProviderInfo = new Lang.Class({ + Name: 'ProviderInfo', Extends: St.Button, PROVIDER_ICON_SIZE: 48, @@ -693,22 +694,28 @@ const ProviderIcon = new Lang.Class({ accessible_name: provider.appInfo.get_name(), track_hover: true }); - this._content = new St.Widget({ layout_manager: new Clutter.BinLayout() }); + this._content = new St.BoxLayout({ vertical: false, + style_class: 'list-search-provider-content' }); this.set_child(this._content); - let rtl = (this.get_text_direction() == Clutter.TextDirection.RTL); - - this.moreIcon = new St.Widget({ style_class: 'search-provider-icon-more', - visible: false, - x_align: rtl ? Clutter.ActorAlign.START : Clutter.ActorAlign.END, - y_align: Clutter.ActorAlign.END, - x_expand: true, - y_expand: true }); - let icon = new St.Icon({ icon_size: this.PROVIDER_ICON_SIZE, gicon: provider.appInfo.get_icon() }); + + let detailsBox = new St.BoxLayout({ style_class: 'list-search-provider-details', + vertical: true, + x_expand: true }); + + let nameLabel = new St.Label({ text: provider.appInfo.get_name(), + x_align: Clutter.ActorAlign.START }); + + this._moreLabel = new St.Label({ x_align: Clutter.ActorAlign.START }); + + detailsBox.add_actor(nameLabel); + detailsBox.add_actor(this._moreLabel); + + this._content.add_actor(icon); - this._content.add_actor(this.moreIcon); + this._content.add_actor(detailsBox); }, animateLaunch: function() { @@ -716,5 +723,10 @@ const ProviderIcon = new Lang.Class({ let app = appSys.lookup_app(this.provider.appInfo.get_id()); if (app.state == Shell.AppState.STOPPED) IconGrid.zoomOutActor(this._content); + }, + + setMoreCount: function(count) { + this._moreLabel.text = _("%d more").format(count); + this._moreLabel.visible = count > 0; } });