tweak to style sub-menus

pull/276/head
Demetrio Rodriguez 3 years ago
parent 0b3e0b2bac
commit 4911bc8027

@ -257,6 +257,10 @@ round_corner() {
sed -i "/\$default_corner:/s/12px/${corner}/" ${SRC_DIR}/_sass/_tweaks-temp.scss
}
install_submenu() {
sed -i "/\$submenu_style:/s/false/true/" ${SRC_DIR}/gnome-shell/sass/_tweaks-temp.scss
}
install_theme_color() {
if [[ "$theme" != '' ]]; then
case "$theme" in
@ -320,6 +324,11 @@ theme_tweaks() {
if [[ "$macstyle" == "true" ]] ; then
install_mac
fi
if [[ "$submenu" == "true" ]] ; then
install_submenu
fi
}
check_shell() {

@ -28,6 +28,7 @@ OPTIONS:
3. black: Full black variant
4. primary: Change radio icon checked color to primary theme color (Default is Green)
5. macos: Change window buttons to MacOS style
6. submenu: Theme sub-menus, by Default submenus contrast
--shell install gnome-shell version [38|40|42]
1. 38: Gnome-shell version < 40.0
@ -127,6 +128,11 @@ while [[ "$#" -gt 0 ]]; do
echo -e "Install MacOS style window button version ..."
shift
;;
submenu)
submenu="true"
echo -e "Install with themed sub-menus ..."
shift
;;
-*)
break
;;

@ -104,3 +104,9 @@ $error_bg_color: $red-400;
$border_color: if($variant == 'light', rgba($black, 0.12), rgba($white, 0.12));
$highlight_color: if($variant == 'light', rgba($white, 0.4), rgba($white, 0.1));
$alt_highlight_color: rgba($white, 0.2);
// extra colors for submenu_style
$selected_fg_color: $fg_color;
$selected_bg_color: rgba($accent_color, 0.2);
$bg_color: $base_color;

@ -20,3 +20,6 @@ $corner_style: 'default';
} @else {
$corner_style: 'square';
}
// Default sub-menu styling
$submenu_style: 'false';

@ -16,6 +16,7 @@
.popup-menu {
min-width: if($laptop == 'true', 10em, 12em);
color: $fg_color;
background-color: if($submenu_style == 'true', $bg_color !important, none);
border: none;
padding: 0;
margin: 0;
@ -37,6 +38,7 @@
spacing: $container_padding;
padding: $container_padding $container_padding * 2;
color: $fg_color !important;
background-color: if($submenu_style == 'true', $bg_color !important, none);
transition-duration: $shorter_duration;
border-radius: if($corner_style == 'circular', $circular_radius, $submenu_item_radius);
background-image: none;
@ -48,6 +50,10 @@
&:checked {
background-color: if($variant == 'light', rgba(black, 0.10), rgba(white, 0.95)) !important;
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: lighten($bg_color, 10%) !important;
}
font-weight: normal;
border-radius: $submenu_item_radius $submenu_item_radius 0 0;
border: none;
@ -56,24 +62,47 @@
&:hover, &:focus, &.selected {
background-color: if($variant == 'light', rgba(black, 0.2), #e5e5e5) !important;
color: rgba(black, 0.85) !important;
@if ($submenu_style == 'true') {
color: $selected_fg_color !important;
background-color: darken($selected_bg_color, 10%) !important;
}
}
&:active {
background-color: #dfdfdf !important;
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: $bg_color !important;
}
}
&.selected:active {
background-color: if($variant == 'light', rgba(black, 0.15), #e0e0e0) !important;
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $selected_fg_color !important;
background-color: darken($selected_bg_color, 10%) !important;
}
}
&:insensitive { color: rgba(black, 0.35) !important; }
&:insensitive {
color: rgba(black, 0.35) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: $bg_color !important;
}
}
}
&:hover, &:focus, &.selected {
background-color: $divider_color !important;
color: $fg_color !important;
@if ($submenu_style == 'true') {
color: $selected_fg_color !important;
background-color: darken($selected_bg_color, 10%) !important;
}
transition-duration: 0ms;
}
@ -90,10 +119,15 @@
// all icons and other graphical elements
.popup-inactive-menu-item {
color: $fg_color !important;
background-color: if($submenu_style == 'true', $bg_color !important, none);
&.selected:active {
background-color: if($variant == 'light', rgba(black, 0.15), #e0e0e0) !important;
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $selected_fg_color !important;
background-color: $selected_bg_color !important;
}
}
&:insensitive { color: $hint_fg_color !important; }
@ -108,6 +142,10 @@
margin: 0;
color: rgba(black, 0.75) !important;
background-color: if($variant == 'light', rgba(black, 0.10), rgba(white, 0.95)) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: lighten($bg_color, 10%) !important;
}
border-radius: 0 0 $submenu_item_radius $submenu_item_radius;
border: none;
box-shadow: none;
@ -117,21 +155,45 @@
margin: 0;
border-radius: $submenu_item_radius;
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: lighten($bg_color, 10%) !important;
}
background-image: none;
&:hover, &:focus, &.selected {
color: rgba(black, 0.85) !important;
background-color: rgba(black, 0.15) !important;
@if ($submenu_style == 'true') {
color: $selected_fg_color !important;
background-color: darken($selected_bg_color, 10%) !important;
}
}
&:active {
color: rgba(black, 0.85) !important;
background-color: rgba(black, 0.2) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: $bg_color !important;
}
}
&.selected:active { color: rgba(black, 0.75) !important; }
&.selected:active {
color: rgba(black, 0.75) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
background-color: $bg_color !important;
}
}
&:insensitive { color: rgba(black, 0.35) !important; }
&:insensitive {
color: rgba(black, 0.35) !important;
@if ($submenu_style == 'true') {
color: $fg_color !important;
// background-color: $bg_color !important; // if enabled this will screw over separator colors in submenus
}
}
}
@extend %scrollbar_on_light;
@ -148,17 +210,18 @@
// separator
.popup-separator-menu-item {
background: none;
// menu separator color
background: if($submenu_style == 'true', $bg_color !important, none);
border: none;
.popup-separator-menu-item-separator {
height: 1px; //not really the whole box
height: if($submenu_style == 'true', 2px, 1px); // increase visibility with a themed menu
margin: $container_padding $container_padding * 8;
background-color: $border_color;
.popup-sub-menu & { //submenu separators
margin: $container_padding $container_padding * 9 $container_padding $container_padding * 4;
background-color: rgba(black, 0.10);
background-color: rgba(black, 0.10); // FIXME: this does not actually do anything, try `pink`
}
}
}

Loading…
Cancel
Save