gtk 3.20: Menu and paned fix. (#311)

* * Menu and paned fix.

* * popover menu transition fix.

* * popover and menuitem separator fix.

* * Re-enabled code.

* * Menu list (gedit) fix style. Other fix.

* * Text warning fix.

* * Text warning fix. Space fix...
pull/317/head
Csaba Jakosa 2016-04-10 14:32:37 +02:00 committed by Dustin Falgout
parent a7fcd6b7b5
commit 06ae107d92
3 changed files with 202 additions and 126 deletions

View File

@ -6,30 +6,32 @@
**********/ **********/
@include exports("menubar") { @include exports("menubar") {
.menubar, menubar { menubar, .menubar {
-GtkWidget-window-dragging: true; -GtkWidget-window-dragging: true;
padding: 0;
border: 0; border: 0;
background-color: $menubar_bg_color; background-color: $menubar_bg_color;
background-image: none; background-image: none;
//box-shadow: inset 0 -1px shade($menubar_bg_color, .9);
color: $menubar_fg_color; color: $menubar_fg_color;
> menuitem {
&.menuitem, .menuitem, menuitem { min-height: 16px;
padding: $spacing ($spacing * 2); padding: $spacing ($spacing * 2);
border: 1px solid transparent; border: 1px solid transparent;
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
color: $menu_fg_color; color: $menubar_fg_color;
&:hover { &:hover {
border-color: mix($menu_bg_color, $menu_fg_color, .21); border-color: mix($menubar_bg_color, $menubar_fg_color, .21);
background-color: mix($menu_bg_color, $menu_fg_color, .21); background-color: mix($menubar_bg_color, $menubar_fg_color, .21);
background-image: none; background-image: none;
color: shade($menu_fg_color, 1.08); color: shade($menubar_fg_color, 1.08);
} }
*:hover { color: shade($menu_fg_color, 1.08); } *:hover { color: shade($menubar_fg_color, 1.08); }
} }
} }
} }
@ -40,58 +42,28 @@
*******/ *******/
@include exports("menu") { @include exports("menu") {
* { menu, .menu {
padding: 0;
}
combobox {
&.menu, .menu, menu {
background-color: $menu_bg_color;
margin: $spacing;
}
}
#toolbar-popup, menu {
padding: 0; padding: 0;
border-radius: 0; border-radius: 0;
border: 0; border: 0;
background-color: $menu_bg_color; background-color: $menu_bg_color;
color: $menu_fg_color; color: $menu_fg_color;
&:checked { background-color: $selected_bg_color; } .csd & { border: 0; } // axes borders in a composited env
button { &:selected { background-color: $selected_bg_color; }
&, &:hover, &:active, &:active *:disabled, &:disabled {
border-width: 0; separator {
background-color: transparent; padding: 0;
background-image: none; border-style: none;
} background-color: shade($menu_bg_color, ($contrast + .1));
} }
}
menuitem window decoration { menuitem {
box-shadow: 0 2px 3px rgba(0,0,0,.2); min-height: 16px;
} min-width: 40px;
padding: $spacing;
.context-menu { font: initial; }
.menuitem, menuitem {
&, menu & {
margin: $spacing;
padding: $spacing 8px;
border: 0;
border-radius: 0; border-radius: 0;
background-color: transparent;
background-image: none;
-GtkMenuItem-arrow-scaling: .5;
menu &:last-child {
padding-bottom: 8px;
}
menu &:first-child {
padding-top: 8px;
}
&:active, &:hover { &:active, &:hover {
border: 0; border: 0;
@ -103,51 +75,88 @@
*:active, *:hover { color: $selected_fg_color; } *:active, *:hover { color: $selected_fg_color; }
&:disabled, *:disabled { color: mix($menu_fg_color, $menu_bg_color, .5); } &:disabled, *:disabled { color: mix($menu_fg_color, $menu_bg_color, .5); }
// submenu indicators
arrow {
min-height: 16px;
min-width: 16px;
&:dir(ltr) {
-gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
margin-left: 10px;
}
&:dir(rtl) {
-gtk-icon-source:-gtk-icontheme('pan-end-symbolic-rtl');
margin-right: 10px;
}
}
&.button, &.button.flat {
&, &:focus, &:active, &:disabled, &:active:disabled {
background-color: transparent;
background-image: none;
border: 0;
box-shadow: none;
color: currentColor;
}
&:hover, &:focus:hover, &:active:hover, &:selected {
background-image: none;
background-color: $selected_bg_color;
color: $selected_fg_color;
}
}
calendar {
&:inconsistent { color: mix($menu_fg_color, $menu_bg_color, .5); }
.button {
border-style: none;
background-color: transparent;
background-image: none;
}
}
} }
&.check, &.radio { // overflow arrows
&, &:focus, &:hover, &:disabled { background-image: none; } > arrow {
//@include button(undecorated);
&, &:focus, &:hover, &:active, &:disabled { min-height: 16px;
border-style: none; min-width: 16px;
padding: $spacing;
background-color: $menu_bg_color;
border-radius: 0;
&.top {
margin-top: -6px;
border-bottom: 1px solid mix($fg_color, $base_color, .1);
-gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
}
&.bottom {
margin-bottom: -6px;
border-top: 1px solid mix($fg_color, $base_color, .1);
-gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
}
&:hover { background-color: mix($fg_color, $base_color, .1); }
&:backdrop { background-color: $backdrop_menu_color; }
&:disabled {
color: transparent;
background-color: transparent; background-color: transparent;
border-color: transparent;
} }
} }
}
&.separator { .context-menu { font: initial; }
padding: 0;
border-style: none; menuitem {
color: shade($menu_bg_color, ($contrast + .1)); accelerator {
}
&.button, &.button.flat {
&, &:focus, &:active, &:disabled, &:active:disabled {
background-color: transparent;
background-image: none;
border: 0;
box-shadow: none;
color: currentColor;
}
&:hover, &:focus:hover, &:active:hover, &:selected {
background-image: none;
background-color: $selected_bg_color;
color: $selected_fg_color;
}
}
calendar {
&:indeterminate { color: mix($menu_fg_color, $menu_bg_color, .5); }
.button {
border-style: none;
background-color: transparent;
background-image: none;
}
}
.accelerator {
color: alpha($menu_fg_color, .6); color: alpha($menu_fg_color, .6);
&:hover { color: alpha($selected_fg_color, .8); } &:hover { color: alpha($selected_fg_color, .8); }
@ -155,6 +164,18 @@
&:disabled { color: alpha(mix($menu_fg_color, $menu_bg_color, .5), .4); } &:disabled { color: alpha(mix($menu_fg_color, $menu_bg_color, .5), .4); }
} }
check, radio {
min-height: 16px;
min-width: 16px;
&:dir(ltr) { margin-right: 7px; }
&:dir(rtl) { margin-left: 7px; }
}
window decoration {
box-shadow: 0 2px 3px alpha($black, .2);
}
entry { @include entry($menu_bg_color, $menu_fg_color); } entry { @include entry($menu_bg_color, $menu_fg_color); }
} }
} }
@ -204,13 +225,28 @@
} }
} }
view, .view, list { treeview.view {
background-color: shade($menu_bg_color, ($contrast + .5)); &:hover, &:selected, &:selected:focus, &:backdrop:selected, &:backdrop:selected:focus { border-top-color: $selected_bg_color; }
background-image: none;
color: $menu_fg_color; &, &:backdrop { border-top-color: shade($menu_bg_color, ($contrast + .4)); }
} }
.list-row, list row { view, .view, list {
&:hover {
background-image: none;
background-color: $selected_bg_color;
color: $selected_fg_color;
}
&, &:backdrop {
background-color: shade($menu_bg_color, ($contrast + .5));
background-image: none;
color: $menu_fg_color;
border-color: border_normal($menu_bg_color);
}
}
list row {
&, & .button { &, & .button {
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
@ -234,14 +270,6 @@
button { @include button($menu_bg_color, $menu_fg_color); } button { @include button($menu_bg_color, $menu_fg_color); }
> list, > view, > toolbar { background-color: transparent; } > list, > view, > toolbar { background-color: transparent; }
separator {
border: 0;
background-color: transparent;
color: alpha($menu_bg_color, .5);
font-size: 80%;
font-weight: bold;
}
} }
modelbutton { modelbutton {
@ -269,5 +297,11 @@
&.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); } &.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
} }
} }
&.flat {
&, &:hover {
transition: none;
}
}
} }
} }

View File

@ -86,32 +86,70 @@
@include exports("paned") { @include exports("paned") {
paned { paned {
-GtkPaned-handle-size: 1; > separator {
-gtk-icon-source: none; min-width: 1px;
min-height: 1px;
-gtk-icon-source: none; // defeats the ugly default handle decoration
border-style: none; // just to be sure
background-color: transparent;
// workaround, using background istead of a border since the border will get rendered twice (?)
background-image: image(shade($bg_color, .9));
background-size: 1px 1px;
margin: 0 $spacing; &:selected { background-image: image($selected_bg_color); } // FIXME is this needed?
&:backdrop { background-image: image($backdrop_borders_color); }
&.wide {
min-width: 5px;
min-height: 5px;
background-color: $bg_color;
background-image: image(border_normal($bg_color)), image(border_normal($bg_color));
background-size: 1px 1px, 1px 1px;
&:backdrop {
background-color: $backdrop_bg_color;
background-image: image($backdrop_borders_color),
image($backdrop_borders_color);
}
}
}
&.horizontal > separator {
background-repeat: repeat-y;
&:dir(ltr) {
margin: 0 -8px 0 0;
padding: 0 8px 0 0;
background-position: left;
}
&:dir(rtl) {
margin: 0 0 0 -8px;
padding: 0 0 0 8px;
background-position: right;
}
&.wide {
margin: 0;
padding: 0;
background-repeat: repeat-y, repeat-y;
background-position: left, right;
}
}
&.vertical > separator {
margin: 0 0 -8px 0;
padding: 0 0 8px 0;
background-repeat: repeat-x;
background-position: top;
&.wide {
margin: 0;
padding: 0;
background-repeat: repeat-x, repeat-x;
background-position: bottom, top;
}
}
} }
paned:dir(rtl) {
margin-right: 0;
margin-left: $spacing;
}
paned .pane-separator { background-color: shade($bg_color, .9); }
paned.wide {
-GtkPaned-handle-size: 4;
margin: 0;
}
paned.wide .pane-separator {
background-color: transparent;
border-style: none solid;
border-color: shade($bg_color, .9);
border-width: 1px;
}
paned.wide.vertical .pane-separator { border-style: solid none; }
} }

View File

@ -47,6 +47,7 @@
border: 1px solid darken($selected_bg_color, 10%); border: 1px solid darken($selected_bg_color, 10%);
background-color: transparentize(darken($selected_bg_color, 10%), 0.8); background-color: transparentize(darken($selected_bg_color, 10%), 0.8);
} }
treeview entry { treeview entry {
&.flat, & { &.flat, & {
border-radius: 0; border-radius: 0;
@ -56,6 +57,7 @@
&:focus { border-color: $selected_bg_color; } &:focus { border-color: $selected_bg_color; }
} }
} }
%column_header_button { %column_header_button {
padding: 0 6px; padding: 0 6px;
border-radius: 0; border-radius: 0;
@ -82,6 +84,7 @@
} }
} }
} }
treeview.view { treeview.view {
-GtkTreeView-grid-line-width: 1; -GtkTreeView-grid-line-width: 1;
-GtkTreeView-grid-line-pattern: ''; -GtkTreeView-grid-line-pattern: '';
@ -127,6 +130,7 @@
border-left-color: mix($backdrop_fg_color, $backdrop_bg_color, .5); border-left-color: mix($backdrop_fg_color, $backdrop_bg_color, .5);
border-top: $backdrop_bg_color; border-top: $backdrop_bg_color;
} }
&:drop(active) { &:drop(active) {
border-style: solid none; border-style: solid none;
border-width: 1px; border-width: 1px;