[gtk+] W32: Add MSW7 notebook theme, move old notebook theme into XP-only CSS
- From: Руслан Ижбулатов <ruslanizhb src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] W32: Add MSW7 notebook theme, move old notebook theme into XP-only CSS
- Date: Tue, 1 Apr 2014 10:44:12 +0000 (UTC)
commit c2b4891854e938b47c857f134598bb96e845e112
Author: Руслан Ижбулатов <lrn1986 gmail com>
Date: Fri Mar 28 00:27:04 2014 +0000
W32: Add MSW7 notebook theme, move old notebook theme into XP-only CSS
https://bugzilla.gnome.org/show_bug.cgi?id=727213
gtk/resources/theme/gtk-win32-base.css | 44 ------
gtk/resources/theme/gtk-win32-xp.css | 43 ++++++
gtk/resources/theme/gtk-win32.css | 235 ++++++++++++++++++++++++++++++++
3 files changed, 278 insertions(+), 44 deletions(-)
---
diff --git a/gtk/resources/theme/gtk-win32-base.css b/gtk/resources/theme/gtk-win32-base.css
index 1855bfe..d621178 100644
--- a/gtk/resources/theme/gtk-win32-base.css
+++ b/gtk/resources/theme/gtk-win32-base.css
@@ -804,50 +804,6 @@ GtkComboBox GtkArrow:insensitive {
color: rgba(255, 0, 0, 0);
}
-
-/* Notebook */
-
-.notebook {
- background-color: #ffffff;
- border-width: 1px 1px 1px 1px;
- border-style: solid;
- background-origin: padding-box;
- background-clip: border-box;
- background-image: -gtk-win32-theme-part(tab, 9 1, margins(-1 -3 -2 -1));
- border-image: -gtk-win32-theme-part(tab, 9 1, margins(0 -2 -1 0)) 1 1 1 1 repeat;
- -GtkNotebook-tab-overlap: 1;
- -GtkNotebook-tab-curvature: 0;
-}
-
-.notebook tab {
- border-width: 0;
- background-image: -gtk-win32-theme-part(tab, 1 1);
- padding: 0px 4px 0px 4px;
-}
-
-.notebook tab.left, .notebook tab.right {
- padding: 4px 0px 4px 0px;
-}
-
-.notebook tab:active {
- background-image: -gtk-win32-theme-part(tab, 1 3, margins(0 0 -1 0));
-}
-.notebook tab:active.top {
- padding: 2px 4px 1px 4px;
-}
-
-.notebook tab:active.bottom {
- padding: 1px 4px 2px 4px;
-}
-
-.notebook tab:active.right {
- padding: 4px 4px 4px 1px;
-}
-
-.notebook tab:active.left {
- padding: 4px 1px 4px 4px;
-}
-
/* Toolbar */
.toolbar {
diff --git a/gtk/resources/theme/gtk-win32-xp.css b/gtk/resources/theme/gtk-win32-xp.css
index c1788a2..ff61e9d 100644
--- a/gtk/resources/theme/gtk-win32-xp.css
+++ b/gtk/resources/theme/gtk-win32-xp.css
@@ -80,3 +80,46 @@ GtkProgressBar.progressbar {
border-style: solid;
border-color: transparent;
}
+
+/* Notebook */
+
+.notebook {
+ background-color: #ffffff;
+ border-width: 1px 1px 1px 1px;
+ border-style: solid;
+ background-origin: padding-box;
+ background-clip: border-box;
+ background-image: -gtk-win32-theme-part(tab, 9 1, margins(-1 -3 -2 -1));
+ border-image: -gtk-win32-theme-part(tab, 9 1, margins(0 -2 -1 0)) 1 1 1 1 repeat;
+ -GtkNotebook-tab-overlap: 1;
+ -GtkNotebook-tab-curvature: 0;
+}
+
+.notebook tab {
+ border-width: 0;
+ background-image: -gtk-win32-theme-part(tab, 1 1);
+ padding: 0px 4px 0px 4px;
+}
+
+.notebook tab.left, .notebook tab.right {
+ padding: 4px 0px 4px 0px;
+}
+
+.notebook tab:active {
+ background-image: -gtk-win32-theme-part(tab, 1 3, margins(0 0 -1 0));
+}
+.notebook tab:active.top {
+ padding: 2px 4px 1px 4px;
+}
+
+.notebook tab:active.bottom {
+ padding: 1px 4px 2px 4px;
+}
+
+.notebook tab:active.right {
+ padding: 4px 4px 4px 1px;
+}
+
+.notebook tab:active.left {
+ padding: 4px 1px 4px 4px;
+}
diff --git a/gtk/resources/theme/gtk-win32.css b/gtk/resources/theme/gtk-win32.css
index f8d774f..f812e4d 100644
--- a/gtk/resources/theme/gtk-win32.css
+++ b/gtk/resources/theme/gtk-win32.css
@@ -82,3 +82,238 @@
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, 5);
+
+ 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.
+ */
+ -GtkNotebook-tab-overlap: 0;
+ -GtkNotebook-tab-curvature: 0;
+}
+
+.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 of notebook 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:prelight {
+ 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:prelight {
+ 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:prelight {
+ 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:prelight {
+ 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:prelight,
+.notebook tab.right:active,
+.notebook tab.right:active:prelight,
+.notebook tab.bottom:active,
+.notebook tab.bottom:active:prelight,
+.notebook tab.left:active,
+.notebook tab.left:active:prelight
+{
+ /* 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:insensitive,
+.notebook tab:insensitive,
+.notebook tab.right:insensitive,
+.notebook tab.bottom:insensitive,
+.notebook tab.left:insensitive
+{
+ /* 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:prelight,
+.notebook tab.right:prelight,
+.notebook tab.bottom:prelight,
+.notebook tab.left:prelight
+{
+ /* 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;
+}
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]