brl/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

appDisplay: Fix app folder icon subicon spacing

Browse Source 
The code previously was using CSS to define row/column spacing and
padding which was combined with a subicon size computed in code relative
to the requested icon size.

In smaller icon sizes it was possible for the CSS spacing+padding + the
size of the two subicons to exceed the requested icon size. This then
would lead to the label being pushed down for app folders compared to
other icons.

Another more severe issue caused by this would happen if the first item
in an icon grid was an app folder. Then the calculation for the maximum
allowed icon size could be off, leading to all icons in the grid
becoming smaller than actually necessary.

This commit changes this to use homogeneous row and column layouts to
evenly distribute the remaining spacing instead of using a fixed CSS
value.

Fixes https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/3069

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1581>
This commit is contained in:
Sebastian Keller 2021-01-20 02:03:49 +01:00 committed by Marge Bot
parent 8c792969bb
commit 18cd24e6f4
2 changed files with 6 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
data/theme/gnome-shell-sass/widgets/_app-grid.scss
View File

@ -89,13 +89,6 @@ $app_grid_fg_color: #fff;
height: 620px; height: 620px;
} }
.app-folder-icon {
padding: $base_padding;
spacing-rows: $base_spacing;
spacing-columns: $base_spacing;
}
// Running app indicator (also shown in dash) // Running app indicator (also shown in dash)
.app-well-app-running-dot { .app-well-app-running-dot {
height: 5px; height: 5px;

9
js/ui/appDisplay.js
View File

@ -1830,13 +1830,16 @@ class FolderView extends BaseAppView {
} }
createFolderIcon(size) { createFolderIcon(size) {
let layout = new Clutter.GridLayout(); const layout = new Clutter.GridLayout({
row_homogeneous: true,
column_homogeneous: true,
});
let icon = new St.Widget({ let icon = new St.Widget({
layout_manager: layout, layout_manager: layout,
style_class: 'app-folder-icon',
x_align: Clutter.ActorAlign.CENTER, x_align: Clutter.ActorAlign.CENTER,
style: 'width: %dpx; height: %dpx;'.format(size, size),
}); });
layout.hookup_style(icon);
let subSize = Math.floor(FOLDER_SUBICON_FRACTION * size); let subSize = Math.floor(FOLDER_SUBICON_FRACTION * size);
let numItems = this._orderedItems.length; let numItems = this._orderedItems.length;