Skip to content

Commit

Permalink
Update menus to look more native on macOS/Windows
Browse files Browse the repository at this point in the history 
- avoid gradients
- don't use radius around selection
- center top menubar
  • Loading branch information
@techee
techee committed Jan 8, 2022
1 parent 4f29b8a commit d795012
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 104 deletions.
61 changes: 9 additions & 52 deletions Prof-Gnome/gtk-3.0/main-dark.css
View file
Expand Up @@ -2780,22 +2780,20 @@ menubar,
-GtkWidget-window-dragging: true;
padding: 0 4px;
background-color: @theme_bg_color;
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.5);
}
menubar > menuitem,
.menubar > menuitem
{
border-radius: 3px;
margin-bottom: 3px;
border-radius: 0;
color: @headerbar_text_color;

min-height: 16px;
padding: 2px 12px;
padding: 3px 12px;
}
menubar > menuitem:hover,
.menubar > menuitem:hover
{
background-image:linear-gradient(shade(@color_accent_3,0.95), shade(@color_accent_3,0.88));
background-color: @color_accent;
color: @selected_text_color;

}
Expand All @@ -2821,16 +2819,6 @@ menu,
margin: 4px;
padding: 6px 0;
background-color:@menu_bg_color;
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
}
.csd menu,
.csd .menu,
Expand All @@ -2842,36 +2830,26 @@ menu,
margin: 4px;
padding: 6px 0;
background-color: alpha(@menu_bg_color,0.985);
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
}
menubar > menuitem menu,
.menubar > menuitem menu
{
border-radius: 0 0 4.66px 4.66px;
border-radius: 0;
}
menubar > menuitem menu menu,
.menubar > menuitem menu menu
{
border-radius: 4.66px;
border-radius: 0;
}
menu menuitem,
.menu menuitem,
.context-menu menuitem
{
color: @text_color;

border-radius: 4.66px;
margin-left: 5px;
margin-right: 5px;
border-radius: 0;
margin-left: 0;
margin-right: 0;
min-height: 16px;
min-width: 40px;
padding: 3px 6px;
Expand All @@ -2882,8 +2860,7 @@ menu menuitem:hover,
{
color: @selected_text_color;

background-color: transparent;
background-image: linear-gradient(to bottom right,@color_600,@color_700);
background-color: @color_accent;
}

menu menuitem:disabled,
Expand Down Expand Up @@ -3007,16 +2984,6 @@ popover
padding: 0;
border-radius: 5px;
background-color: @menu_bg_color;
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.csd .popover_bg,
Expand All @@ -3030,16 +2997,6 @@ popover
padding: 0;
border-radius: 5px;
background-color: alpha(@menu_bg_color,0.985);
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
popover.background > list,
Expand Down
61 changes: 9 additions & 52 deletions Prof-Gnome/gtk-3.0/main-light.css
View file
Expand Up @@ -2776,22 +2776,20 @@ menubar,
-GtkWidget-window-dragging: true;
padding: 0 4px;
background-color: @theme_bg_color;
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
}
menubar > menuitem,
.menubar > menuitem
{
border-radius: 3px;
margin-bottom: 3px;
border-radius: 0;
color: @headerbar_text_color;

min-height: 16px;
padding: 2px 12px;
padding: 3px 12px;
}
menubar > menuitem:hover,
.menubar > menuitem:hover
{
background-image:linear-gradient(shade(@color_accent_3,0.95), shade(@color_accent_3,0.88));
background-color: @color_accent;
color: @selected_text_color;

}
Expand All @@ -2814,16 +2812,6 @@ menu,
margin: 4px;
padding: 6px 0;
background-color:@menu_bg_color;
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);



Expand All @@ -2833,16 +2821,6 @@ menu,
.csd .context-menu
{
background-color: alpha(@menu_bg_color,0.985);
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
border: 1px solid @borders;


Expand All @@ -2852,12 +2830,12 @@ menu,
menubar > menuitem menu,
.menubar > menuitem menu
{
border-radius: 0 0 4.66px 4.66px;
border-radius: 0;
}
menubar > menuitem menu menu,
.menubar > menuitem menu menu
{
border-radius: 4.66px;
border-radius: 0;
}
menu menuitem,
.menu menuitem,
Expand All @@ -2867,9 +2845,9 @@ menu menuitem,

min-height: 16px;
min-width: 40px;
border-radius: 4.66px;
margin-left: 5px;
margin-right: 5px;
border-radius: 0;
margin-left: 0;
margin-right: 0;
padding: 3px 6px;
}
menu menuitem:hover,
Expand All @@ -2878,8 +2856,7 @@ menu menuitem:hover,
{
color: @selected_text_color;

background-color: transparent;
background-image: linear-gradient(to bottom right,@color_600,@color_700);
background-color: @color_accent;
}

menu menuitem:disabled,
Expand Down Expand Up @@ -3002,16 +2979,6 @@ popover
padding: 0;
border-radius: 5px;
background-color: @menu_bg_color;
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);

box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
Expand All @@ -3021,16 +2988,6 @@ popover
{ color: @text_color;

background-color: alpha(shade(@menu_bg_color,1),0.985);
background-image: linear-gradient(to top,
transparent,
alpha(@shadows_dark,0.03),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.08),
alpha(@shadows_dark,0.06),
alpha(@shadows_dark,0.03),
transparent);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);


Expand Down

0 comments on commit d795012

Please sign in to comment.