gnome-shell/data/theme/gnome-shell-sass/widgets/_popovers.scss
maniacx a0fde0eed5 popupMenu: Replace ornament unicode with icons
Ported from Sam Hewett's Merge-Request.
https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2308#8714a3530d73823716c0f8334aceaabeaccd01b7

The CHECK ornament used in powerprofile and volume control is not very
pleasant looking, specially if system font is changed.
Replace CHECK and DOT unicode ornament with revelant icons in popupMenu.

Solves issue: https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/6055

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2767>
2023-05-17 17:41:10 +00:00

160 lines
3.5 KiB
SCSS

/* Popovers/Menus */
$menu_bg_color: $bg_color;
$menuitem_bg_color: lighten($menu_bg_color, 4%);
$menuitem_border_radius: $base_border_radius*1.5;
$submenu_bg_color: lighten($menu_bg_color, 7%);
// the popover itself
.popup-menu-boxpointer {
-arrow-rise: $base_margin+2px; // distance from the panel & screen edge
}
// container of the popover menu
.popup-menu {
min-width: 15em;
color: $fg_color;
//.popup-status-menu-item {font-weight: normal; color: pink;} //dunno what that is
&.panel-menu {
margin-bottom: 1.75em; // so it doesn't touch the bottom of the screen
}
}
// popover content
.popup-menu-content {
padding: $base_padding;
background-color: $bg_color;
border-radius: $modal_radius*1.25;
border: 1px solid $outer_borders_color;
box-shadow: 0 2px 4px 0 $shadow_color;
}
// menu items
.popup-menu-item {
@include menuitem($bg:$menu_bg_color);
border-radius: $menuitem_border_radius;
&:checked {
border-radius: $menuitem_border_radius $menuitem_border_radius 0 0 !important;
@if $is_highcontrast {
border: 1px solid $hc_inset_color;
border-bottom-width:0;
}
}
// add margin to switches in menu items
.toggle-switch {
&:ltr { margin-left: $base_margin;}
&:rtl { margin-right: $base_margin;}
}
}
// all other graphical elements (sliders)
.popup-inactive-menu-item {
color: $fg_color;
&:insensitive { color: $insensitive_fg_color; }
}
// symbolic icons in popover
.popup-menu-arrow,
.popup-menu-icon {
icon-size: 16px !important; // for some reason the variable doesn't work here
}
// popover submenus
.popup-sub-menu {
border-radius: 0 0 $menuitem_border_radius+1px $menuitem_border_radius+1px;
margin-bottom: $base_padding;
@if $is_highcontrast {
border: 1px solid $hc_inset_color;
}
.popup-menu-ornament {
icon-size: $base_icon_size !important;
width: $base_icon_size;
}
// submenu specific styles
.popup-menu-item {
border-radius: 0;
@include menuitem($bg:$submenu_bg_color, $flat:false);
border-top-width:0;
&:last-child {
border-radius: 0 0 $menuitem_border_radius $menuitem_border_radius;
border-bottom-width:0;
}
}
.popup-menu-section {
.popup-menu-item:last-child {
&:hover,&:focus { border-radius: 0;}
}
&:last-child .popup-menu-item:last-child {
border-radius: 0 0 $menuitem_border_radius $menuitem_border_radius;
}
}
}
// container for radio and check boxes
.popup-menu-ornament {
icon-size: $base_icon_size !important;
width: $base_icon_size;
}
// separator
.popup-separator-menu-item {
border:none !important;
.popup-separator-menu-item-separator {
height: 1px; //not really the whole box
background-color: $borders_color;
}
.popup-menu-ornament {
width: 0 !important;
}
// separators in submenus
.popup-sub-menu & {
background-color: transparent;
// account for ornament
&:ltr { margin-right: 2.5em;}
&:rtl { margin-left: 2.5em;}
.popup-separator-menu-item-separator {
background-color: $borders_color;
}
}
}
// desktop background menu
.background-menu {
-boxpointer-gap: 0px;
-arrow-rise: 0px; // hide the beak on the menu
}
// right-click (and panel) app menu
.app-menu {
max-width: 27.25em;
// this is unneeded at the top-level in this menu, hide it
.popup-menu-ornament { width: 0 !important; }
.popup-inactive-menu-item:first-child {
// "Open Windows" label
> StLabel {
@extend %caption_heading;
&:ltr {margin-right: $base_margin*2;}
&:rtl {margin-left: $base_margin*2;}
}
}
}