forked from AuroraMiddleware/gtk
424 lines
13 KiB
CSS
424 lines
13 KiB
CSS
@import url("gtk-win32-base.css");
|
|
|
|
/* Menus */
|
|
|
|
menubar {
|
|
background-color: transparent;
|
|
border-width: 0;
|
|
background-image: -gtk-win32-theme-part(menu, 7, 1);
|
|
}
|
|
|
|
menubar > menuitem {
|
|
background-color: transparent;
|
|
border-width: 0;
|
|
background-image: -gtk-win32-theme-part(menu, 8, 1);
|
|
}
|
|
|
|
menubar > menuitem:hover {
|
|
background-image: -gtk-win32-theme-part(menu, 8, 3);
|
|
}
|
|
|
|
menuitem:hover {
|
|
background-image: -gtk-win32-theme-part(menu, 14, 2);
|
|
}
|
|
|
|
menuitem:hover:disabled {
|
|
background-image: -gtk-win32-theme-part(menu, 14, 4);
|
|
}
|
|
|
|
menuitem radio,
|
|
menuitem radio:hover,
|
|
menuitem radio:disabled {
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem radio:active,
|
|
menuitem radio:active:hover {
|
|
background-image: -gtk-win32-theme-part(menu, 11, 3);
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem radio:indeterminate,
|
|
menuitem radio:indeterminate:disabled,
|
|
menuitem radio:indeterminate:hover,
|
|
menuitem radio:indeterminate:active,
|
|
menuitem radio:indeterminate:active:hover {
|
|
background-image: none; /* Fall back to default, this state is not in win32 */
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem radio:disabled:active,
|
|
menuitem radio:disabled:active:hover {
|
|
background-image: -gtk-win32-theme-part(menu, 11, 4);
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem check,
|
|
menuitem check:hover,
|
|
menuitem check:disabled {
|
|
background-image: none;
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem check:active,
|
|
menuitem check:active:hover {
|
|
background-image: -gtk-win32-theme-part(menu, 11, 1);
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem check:indeterminate,
|
|
menuitem check:indeterminate:disabled,
|
|
menuitem check:indeterminate:hover,
|
|
menuitem check:indeterminate:active,
|
|
menuitem check:indeterminate:active:hover {
|
|
background-image: none; /* Fall back to default, this state is not in win32 */
|
|
border-width: 0;
|
|
}
|
|
|
|
menuitem check:disabled:active,
|
|
menuitem check:disabled:active:hover{
|
|
background-image: -gtk-win32-theme-part(menu, 11, 2);
|
|
border-width: 0;
|
|
}
|
|
|
|
/* Notebook */
|
|
notebook {
|
|
/* This prevents a thin half-transparent line between the pane and the tab */
|
|
background-color: -gtk-win32-color(tab, window);
|
|
|
|
border-width: 1px 1px 1px 1px;
|
|
border-style: solid;
|
|
background-origin: padding-box;
|
|
background-clip: border-box;
|
|
|
|
/* W32 theme draws it with borders and all, cut them away */
|
|
background-image: -gtk-win32-theme-part(tab, 9, 1, margins(-1 -3 -2 -1));
|
|
|
|
/* Grab the borders now and duplicate them across the perimeter */
|
|
border-image: -gtk-win32-theme-part(tab, 9, 1, margins(0 -2 -1 0)) 1 1 1 1 repeat;
|
|
/* MSW7 themes draw tab overlaps differently. Net result is:
|
|
* inactive tab text never moves no matter which tabs get to be active
|
|
* active tab text moves only up
|
|
* active tab steals space from its neighbors (overlapping their borders without moving them)
|
|
* inactive tab does not steal any space from its neighbors (prelight makes that obvious - one tab's borders light up, its neighbors' don't change)
|
|
* first(last in RTL?) tab has extra gap that disappears (due to overlapping) when this tab activates
|
|
This can't be emulated in GTK, so we won't even try.
|
|
*/
|
|
}
|
|
|
|
notebook tab {
|
|
/* Make sure parts not covered by the background are transparent */
|
|
background-color: transparent;
|
|
|
|
/* Use GTK border, since we can control where it's drawn (unlike built-in theme border, which is always left-top-right) */
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
border-color: rgb(137, 140, 149);
|
|
|
|
/* Sadly, GTK CSS can't rotate images, which means that we can't use tabs from the theme */
|
|
background-image: none;
|
|
/* Don't use border image either, since it has no bottom border */
|
|
border-image: none;
|
|
|
|
/* By default tabs are large enough for their labels, give them more space */
|
|
padding: 2px;
|
|
}
|
|
|
|
/* W32 has no concept ofnotebook header (the rectangle where tabs are - including the area where tabs could be, if you add more of them), make it disappear */
|
|
notebook.header {
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-width: 0px;
|
|
border-color: transparent;
|
|
}
|
|
|
|
/* Draw everything ourselves. Default MSW7 theme for a top tab (the only kind of tab available) is:
|
|
1-px grey border
|
|
extra 1-px inside white borders to the left and the right
|
|
top 8 pixels of the tab are light grey gradient (from 95% to 92% here)
|
|
rest of the tab is dark grey gradient (quick 3-pixel fall from 87% to 85%, then uniform until half the way, then drops to 84%, last 4 pixels fall down to 81%)
|
|
|
|
Prelight tab is the same as normal, but with light blue instead of grey.
|
|
Active tabs (prelight ot not) are simple white.
|
|
Disabled tabs are simple dark grey.
|
|
There's also theme part for "focused" tab (simple pale blue), but it is unclear in which circumstances it's used.
|
|
|
|
Normal and selected tab borders are grey.
|
|
Prelight tab borders are blue.
|
|
Disabled tab borders are darker grey.
|
|
*/
|
|
notebook tab.top {
|
|
background-image: -gtk-gradient (linear,
|
|
0 0, 0 1,
|
|
color-stop(0, rgb(242, 242, 242)),
|
|
color-stop(0.2, rgb(235, 235, 235)),
|
|
color-stop(0.21, rgb(221, 221, 221)),
|
|
color-stop(0.22, rgb(216, 216, 216)),
|
|
color-stop(0.6, rgb(214, 214, 214)),
|
|
color-stop(0.9, rgb(214, 214, 214)),
|
|
color-stop(1, rgb(207, 207, 207)));
|
|
box-shadow: inset -1px 0px 0px white, inset 1px 0px 0px white;
|
|
/* Tab border is 1px (see above), override bottom border (for top tabs) to be 0px */
|
|
border-bottom: 0px;
|
|
}
|
|
|
|
notebook tab.top:hover {
|
|
background-image: -gtk-gradient (linear,
|
|
0 0, 0 1,
|
|
color-stop(0, rgb(234, 246, 253)),
|
|
color-stop(0.2, rgb(217, 240, 252)),
|
|
color-stop(0.21, rgb(190, 230, 253)),
|
|
color-stop(0.22, rgb(181, 226, 250)),
|
|
color-stop(0.6, rgb(178, 224, 249)),
|
|
color-stop(0.9, rgb(175, 222, 248)),
|
|
color-stop(1, rgb(167, 217, 245)));
|
|
}
|
|
|
|
notebook tab.left {
|
|
background-image: -gtk-gradient (linear,
|
|
0 0, 1 0,
|
|
color-stop(0, rgb(242, 242, 242)),
|
|
color-stop(0.2, rgb(235, 235, 235)),
|
|
color-stop(0.21, rgb(221, 221, 221)),
|
|
color-stop(0.22, rgb(216, 216, 216)),
|
|
color-stop(0.6, rgb(214, 214, 214)),
|
|
color-stop(0.9, rgb(214, 214, 214)),
|
|
color-stop(1, rgb(207, 207, 207)));
|
|
|
|
box-shadow: inset 0px -1px 0px white, inset 0px 1px 0px white;
|
|
/* Tab border is 1px (see above), override right border (for left tabs) to be 0px */
|
|
border-right: 0px;
|
|
}
|
|
|
|
notebook tab.left:hover {
|
|
background-image: -gtk-gradient (linear,
|
|
0 0, 1 0,
|
|
color-stop(0, rgb(234, 246, 253)),
|
|
color-stop(0.2, rgb(217, 240, 252)),
|
|
color-stop(0.21, rgb(190, 230, 253)),
|
|
color-stop(0.22, rgb(181, 226, 250)),
|
|
color-stop(0.6, rgb(178, 224, 249)),
|
|
color-stop(0.9, rgb(175, 222, 248)),
|
|
color-stop(1, rgb(167, 217, 245)));
|
|
}
|
|
|
|
notebook tab.right {
|
|
background-image: -gtk-gradient (linear,
|
|
1 0, 0 0,
|
|
color-stop(0, rgb(242, 242, 242)),
|
|
color-stop(0.2, rgb(235, 235, 235)),
|
|
color-stop(0.21, rgb(221, 221, 221)),
|
|
color-stop(0.22, rgb(216, 216, 216)),
|
|
color-stop(0.6, rgb(214, 214, 214)),
|
|
color-stop(0.9, rgb(214, 214, 214)),
|
|
color-stop(1, rgb(207, 207, 207)));
|
|
|
|
box-shadow: inset 0px 1px 0px white, inset 0px -1px 0px white;
|
|
/* Tab border is 1px (see above), override left border (for right tabs) to be 0px */
|
|
border-left: 0px;
|
|
}
|
|
|
|
notebook tab.right:hover {
|
|
background-image: -gtk-gradient (linear,
|
|
1 0, 0 0,
|
|
color-stop(0, rgb(234, 246, 253)),
|
|
color-stop(0.2, rgb(217, 240, 252)),
|
|
color-stop(0.21, rgb(190, 230, 253)),
|
|
color-stop(0.22, rgb(181, 226, 250)),
|
|
color-stop(0.6, rgb(178, 224, 249)),
|
|
color-stop(0.9, rgb(175, 222, 248)),
|
|
color-stop(1, rgb(167, 217, 245)));
|
|
}
|
|
|
|
notebook tab.bottom {
|
|
background-image: -gtk-gradient (linear,
|
|
0 1, 0 0,
|
|
color-stop(0, rgb(242, 242, 242)),
|
|
color-stop(0.2, rgb(235, 235, 235)),
|
|
color-stop(0.21, rgb(221, 221, 221)),
|
|
color-stop(0.22, rgb(216, 216, 216)),
|
|
color-stop(0.6, rgb(214, 214, 214)),
|
|
color-stop(0.9, rgb(214, 214, 214)),
|
|
color-stop(1, rgb(207, 207, 207)));
|
|
box-shadow: inset -1px 0px 0px white, inset 1px 0px 0px white;
|
|
/* Tab border is 1px (see above), override top border (for bottom tabs) to be 0px */
|
|
border-top: 0px;
|
|
}
|
|
|
|
notebook tab.bottom:hover {
|
|
background-image: -gtk-gradient (linear,
|
|
0 1, 0 0,
|
|
color-stop(0, rgb(234, 246, 253)),
|
|
color-stop(0.2, rgb(217, 240, 252)),
|
|
color-stop(0.21, rgb(190, 230, 253)),
|
|
color-stop(0.22, rgb(181, 226, 250)),
|
|
color-stop(0.6, rgb(178, 224, 249)),
|
|
color-stop(0.9, rgb(175, 222, 248)),
|
|
color-stop(1, rgb(167, 217, 245)));
|
|
}
|
|
|
|
notebook tab:active,
|
|
notebook tab:active:hover,
|
|
notebook tab.right:active,
|
|
notebook tab.right:active:hover,
|
|
notebook tab.bottom:active,
|
|
notebook tab.bottom:active:hover,
|
|
notebook tab.left:active,
|
|
notebook tab.left:active:hover
|
|
{
|
|
/* active tabs are pure white with grey borders, and prelight changes nothing */
|
|
background-image: none;
|
|
background-color: white;
|
|
border-color: rgb(137, 140, 149);
|
|
}
|
|
|
|
notebook tab:disabled,
|
|
notebook tab:disabled,
|
|
notebook tab.right:disabled,
|
|
notebook tab.bottom:disabled,
|
|
notebook tab.left:disabled
|
|
{
|
|
/* insensitive tabs are dark grey white with even darker grey borders */
|
|
background-image: none;
|
|
background-color: rgb(201, 202, 203);
|
|
border-color: rgb(128, 128, 128);
|
|
}
|
|
|
|
notebook tab:hover,
|
|
notebook tab.right:hover,
|
|
notebook tab.bottom:hover,
|
|
notebook tab.left:hover
|
|
{
|
|
/* prelight tabs have blue borders */
|
|
border-color: rgb(60, 127, 177);
|
|
}
|
|
|
|
|
|
notebook tab.top:active {
|
|
/* Make active tab "stick out" up by padding it more at the bottom */
|
|
padding-bottom: 4px;
|
|
}
|
|
|
|
notebook tab.right:active {
|
|
/* Make active tab "stick out" right by padding it more at the left */
|
|
padding-left: 4px;
|
|
}
|
|
|
|
notebook tab.bottom:active {
|
|
/* Make active tab "stick out" down by padding it more at the top */
|
|
padding-top: 4px;
|
|
}
|
|
|
|
notebook tab.left:active {
|
|
/* Make active tab "stick out" left by padding it more at the right */
|
|
padding-right: 4px;
|
|
}
|
|
|
|
|
|
/* Listbox */
|
|
|
|
/* We're cheating here, using part 6 (listview header group),
|
|
because part 1 (listview item) is empty for some reason */
|
|
row:hover {
|
|
background-image: -gtk-win32-theme-part(listview, 6, 10);
|
|
}
|
|
|
|
row:selected {
|
|
background-color: transparent;
|
|
/* Override *:selected {} blanket style, keeping the background - bright
|
|
and the text - dark */
|
|
color: @text_color;
|
|
background-image: -gtk-win32-theme-part(listview, 6, 13);
|
|
}
|
|
|
|
row:selected:focus {
|
|
background-image: -gtk-win32-theme-part(listview, 6, 11);
|
|
}
|
|
|
|
row:selected:hover {
|
|
background-image: -gtk-win32-theme-part(listview, 6, 12);
|
|
}
|
|
|
|
/* Titlebar */
|
|
|
|
window .titlebar {
|
|
background: -gtk-win32-theme-part(window, 1, 1);
|
|
}
|
|
|
|
window:backdrop .titlebar {
|
|
background: -gtk-win32-theme-part(window, 1, 2);
|
|
}
|
|
|
|
window .titlebar:disabled {
|
|
background: -gtk-win32-theme-part(window, 1, 3);
|
|
}
|
|
|
|
.titlebar button.close {
|
|
background-image: -gtk-win32-theme-part(window, 18, 1);
|
|
color: transparent;
|
|
}
|
|
|
|
.titlebar button.close:hover {
|
|
background-image: -gtk-win32-theme-part(window, 18, 2);
|
|
}
|
|
|
|
.titlebar button.close:active {
|
|
background-image: -gtk-win32-theme-part(window, 18, 3);
|
|
}
|
|
|
|
.titlebar button.close:disabled {
|
|
background-image: -gtk-win32-theme-part(window, 18, 4);
|
|
}
|
|
|
|
.titlebar button.minimize {
|
|
background-image: -gtk-win32-theme-part(window, 15, 1);
|
|
color: transparent;
|
|
}
|
|
|
|
.titlebar button.minimize:hover {
|
|
background-image: -gtk-win32-theme-part(window, 15, 2);
|
|
}
|
|
|
|
.titlebar button.minimize:active {
|
|
background-image: -gtk-win32-theme-part(window, 15, 3);
|
|
}
|
|
|
|
.titlebar button.minimize:disabled {
|
|
background-image: -gtk-win32-theme-part(window, 15, 4);
|
|
}
|
|
|
|
.titlebar button.maximize {
|
|
background-image: -gtk-win32-theme-part(window, 17, 1);
|
|
color: transparent;
|
|
}
|
|
|
|
.titlebar button.maximize:hover {
|
|
background-image: -gtk-win32-theme-part(window, 17, 2);
|
|
}
|
|
|
|
.titlebar button.maximize:active {
|
|
background-image: -gtk-win32-theme-part(window, 17, 3);
|
|
}
|
|
|
|
.titlebar button.maximize:disabled {
|
|
background-image: -gtk-win32-theme-part(window, 17, 4);
|
|
}
|
|
|
|
.maximized .titlebar button.maximize {
|
|
background-image: -gtk-win32-theme-part(window, 21, 1);
|
|
}
|
|
|
|
.maximized .titlebar button.maximize:hover {
|
|
background-image: -gtk-win32-theme-part(window, 21, 2);
|
|
}
|
|
|
|
.maximized .titlebar button.maximize:active {
|
|
background-image: -gtk-win32-theme-part(window, 21, 3);
|
|
}
|
|
|
|
.maximized .titlebar button.maximize:disabled {
|
|
background-image: -gtk-win32-theme-part(window, 21, 4);
|
|
}
|