341cad764e
As per feedback, remove the visible styling of the page indicators. They're still used to layout and detect drag hovering, so the actors are still in place, but they're completely transparent now. Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2335>
140 lines
3.0 KiB
SCSS
140 lines
3.0 KiB
SCSS
/* App Grid */
|
|
|
|
$app_icon_size: 96px;
|
|
|
|
// app icons
|
|
.icon-grid {
|
|
row-spacing: $base_padding * 2;
|
|
column-spacing: $base_padding * 2;
|
|
max-row-spacing: $base_padding * 7;
|
|
max-column-spacing: $base_padding * 7;
|
|
page-padding-top: $base_padding * 4;
|
|
page-padding-bottom: $base_padding * 4;
|
|
page-padding-left: $base_padding * 3;
|
|
page-padding-right: $base_padding * 3;
|
|
}
|
|
|
|
/* App Icons */
|
|
|
|
// Icon tiles in the app grid
|
|
.app-well-app {
|
|
@include overview_icon($osd_fg_color);
|
|
|
|
.overview-icon { padding: $base_padding*2;}
|
|
.overview-icon.overview-icon-with-label {
|
|
> StBoxLayout {
|
|
spacing: $base_padding;
|
|
}
|
|
}
|
|
}
|
|
|
|
// app folders
|
|
.app-well-app.app-folder {
|
|
@include overview_icon($osd_fg_color, $flat: false);
|
|
}
|
|
|
|
// expanded folder
|
|
.app-folder-dialog {
|
|
border-radius: $modal_radius*2;
|
|
background-color: $dash_background_color;
|
|
|
|
& .folder-name-container {
|
|
padding: 24px 36px 0;
|
|
spacing: 12px;
|
|
|
|
& .folder-name-label,
|
|
& .folder-name-entry {
|
|
@extend %title_1;
|
|
}
|
|
|
|
& .folder-name-entry { width: 300px }
|
|
|
|
/* FIXME: this is to keep the label in sync with the entry */
|
|
& .folder-name-label { padding: 5px 7px; color: $osd_fg_color; }
|
|
|
|
& .edit-folder-button {
|
|
@extend %button;
|
|
padding: 0;
|
|
width: 36px;
|
|
height: 36px;
|
|
border-radius: 99px;
|
|
& > StIcon { icon-size: $base_icon_size }
|
|
}
|
|
}
|
|
|
|
& .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 {
|
|
margin-bottom: 18px;
|
|
}
|
|
}
|
|
|
|
.app-folder-dialog-container {
|
|
padding: $base_padding*2;
|
|
width: 640px;
|
|
height: 640px;
|
|
}
|
|
|
|
// Running app indicator (also shown in dash)
|
|
.app-well-app-running-dot {
|
|
height: 5px;
|
|
width: 5px;
|
|
border-radius:5px;
|
|
margin-bottom: 8px;
|
|
background-color: $osd_fg_color;
|
|
}
|
|
|
|
// Rename popup for app folders
|
|
.rename-folder-popup {
|
|
.rename-folder-popup-item {
|
|
spacing: $base_padding;
|
|
&:ltr, &:rtl { padding: 0 $base_padding * 2; }
|
|
}
|
|
}
|
|
|
|
// App Grid pagination indicators
|
|
.page-indicator {
|
|
padding: $base_padding $base_padding * 2 0;
|
|
transition-duration:400ms;
|
|
|
|
.page-indicator-icon {
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 10px; // the same as height&width
|
|
background-color: white;
|
|
}
|
|
}
|
|
|
|
.apps-scroll-view {
|
|
padding: 0;
|
|
}
|
|
|
|
// shutdown and other actions in the grid
|
|
.system-action-icon {
|
|
background-color: rgba(0,0,0,0.8);
|
|
color: #fff;
|
|
border-radius: 99px;
|
|
icon-size: $app_icon_size * 0.5;
|
|
}
|
|
|
|
.page-navigation-arrow {
|
|
& > StIcon {
|
|
margin: 6px;
|
|
padding: 18px;
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 99px;
|
|
}
|
|
|
|
&:insensitive > StIcon { @include button(undecorated, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
|
|
&:hover > StIcon { @include button(hover, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
|
|
&:active > StIcon { @include button(active, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
|
|
}
|