appDisplay: CSS cleanup & fixes for app dialog
- change the container and dialog actor alignments - pad the container to not have dialog overlap panel - clean up extraneous app-folder css Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/3044>
This commit is contained in:
parent
0ffddb0cd2
commit
15e0440a8b
@ -1,13 +1,14 @@
|
|||||||
/* App Grid */
|
/* App Grid */
|
||||||
|
|
||||||
$app_icon_size: 96px;
|
$app_icon_size: 96px;
|
||||||
|
$app_folder_size: 720px;
|
||||||
|
|
||||||
// app icons
|
// app icons
|
||||||
.icon-grid {
|
.icon-grid {
|
||||||
row-spacing: $base_padding * 2;
|
row-spacing: $base_padding * 2;
|
||||||
column-spacing: $base_padding * 2;
|
column-spacing: $base_padding * 2;
|
||||||
max-row-spacing: $base_padding * 7;
|
max-row-spacing: $base_padding * 6;
|
||||||
max-column-spacing: $base_padding * 7;
|
max-column-spacing: $base_padding * 6;
|
||||||
page-padding-top: $base_padding * 4;
|
page-padding-top: $base_padding * 4;
|
||||||
page-padding-bottom: $base_padding * 4;
|
page-padding-bottom: $base_padding * 4;
|
||||||
page-padding-left: $base_padding * 3;
|
page-padding-left: $base_padding * 3;
|
||||||
@ -52,22 +53,29 @@ $app_icon_size: 96px;
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// expanded folder
|
.app-folder-dialog-container {
|
||||||
|
// pad the top with panel height so the folder doesn't overlap the panel on smaller resolutions
|
||||||
|
padding-top: $panel_height;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Expanded app folder dialog
|
||||||
.app-folder-dialog {
|
.app-folder-dialog {
|
||||||
|
width: $app_folder_size;
|
||||||
|
height: $app_folder_size;
|
||||||
|
|
||||||
border-radius: $modal_radius * 4;
|
border-radius: $modal_radius * 4;
|
||||||
background-color: $system_overlay_bg_color;
|
background-color: $system_overlay_bg_color;
|
||||||
|
box-shadow: inset 0 0 0 1px $system_borders_color;
|
||||||
|
padding: 0 1px;
|
||||||
|
|
||||||
@if $is_highcontrast {
|
@if $is_highcontrast {
|
||||||
padding: $base_padding*2 2px $base_padding*2 2px;
|
padding: 0 2px;
|
||||||
box-shadow: inset 0 0 0 2px $hc_inset_color;
|
box-shadow: inset 0 0 0 2px $hc_inset_color;
|
||||||
} @else {
|
|
||||||
padding: $base_padding*2 1px $base_padding*2 1px;
|
|
||||||
box-shadow: inset 0 0 0 1px $system_borders_color;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& .folder-name-container {
|
& .folder-name-container {
|
||||||
padding: $base_padding * 4 $base_padding * 6 0;
|
padding: $base_padding * 4 $base_padding * 6;
|
||||||
spacing: $base_padding * 2;
|
padding-bottom: 0;
|
||||||
|
|
||||||
& .folder-name-label,
|
& .folder-name-label,
|
||||||
& .folder-name-entry {
|
& .folder-name-entry {
|
||||||
@ -76,32 +84,14 @@ $app_icon_size: 96px;
|
|||||||
|
|
||||||
& .folder-name-entry {
|
& .folder-name-entry {
|
||||||
width: 12em;
|
width: 12em;
|
||||||
color: $system_fg_color !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* FIXME: this is to keep the label in sync with the entry */
|
|
||||||
& .folder-name-label { padding: 5px 7px; color: $system_fg_color; }
|
|
||||||
}
|
|
||||||
|
|
||||||
& .icon-grid {
|
|
||||||
row-spacing: $base_padding * 2;
|
|
||||||
column-spacing: $base_padding * 5;
|
|
||||||
page-padding-top: 0;
|
|
||||||
page-padding-bottom: 0;
|
|
||||||
page-padding-left: 0;
|
|
||||||
page-padding-right: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& .page-indicators {
|
& .page-indicators {
|
||||||
margin-bottom: 18px;
|
margin-bottom: $base_padding * 4;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-folder-dialog-container {
|
|
||||||
padding: $base_padding * 2;
|
|
||||||
width: 720px;
|
|
||||||
height: 720px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Rename popup for app folders
|
// Rename popup for app folders
|
||||||
|
@ -2531,16 +2531,16 @@ export const AppFolderDialog = GObject.registerClass({
|
|||||||
style_class: 'app-folder-dialog',
|
style_class: 'app-folder-dialog',
|
||||||
x_expand: true,
|
x_expand: true,
|
||||||
y_expand: true,
|
y_expand: true,
|
||||||
x_align: Clutter.ActorAlign.FILL,
|
x_align: Clutter.ActorAlign.CENTER,
|
||||||
y_align: Clutter.ActorAlign.FILL,
|
y_align: Clutter.ActorAlign.CENTER,
|
||||||
vertical: true,
|
vertical: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
this.child = new St.Bin({
|
this.child = new St.Bin({
|
||||||
style_class: 'app-folder-dialog-container',
|
style_class: 'app-folder-dialog-container',
|
||||||
child: this._viewBox,
|
child: this._viewBox,
|
||||||
x_align: Clutter.ActorAlign.CENTER,
|
x_align: Clutter.ActorAlign.FILL,
|
||||||
y_align: Clutter.ActorAlign.CENTER,
|
y_align: Clutter.ActorAlign.FILL,
|
||||||
});
|
});
|
||||||
|
|
||||||
this._addFolderNameEntry();
|
this._addFolderNameEntry();
|
||||||
|
Loading…
x
Reference in New Issue
Block a user