Skip to content

Commit

Permalink
unify gtk2 & gtk3 headerbar
Browse files Browse the repository at this point in the history
  • Loading branch information
reorr committed Nov 5, 2017
1 parent d66b806 commit a00244e
Show file tree
Hide file tree
Showing 4 changed files with 208 additions and 168 deletions.
108 changes: 53 additions & 55 deletions whitey/gtk-3.0/gtk.css
Original file line number Diff line number Diff line change
Expand Up @@ -532,7 +532,7 @@ GtkTextView {
border-radius: 100px; }
.button.osd.image-button {
padding: 1.3em;
background-color: #2b2b2b; }
background-color: #FFFFFF; }
.button.osd.image-button:not(:active):not(:insensitive):not(hover) {
color: #E8E8E8; }
.button.osd.image-button:hover {
Expand Down Expand Up @@ -1190,8 +1190,7 @@ GtkComboBox {
padding: 0.4em;
border-width: 0;
background-color: #FFFFFF;
color: rgba(38, 50, 56, 0.75);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.18), inset 0 4px 2px -4px rgba(0, 0, 0, 0.2), inset 0 8px 3px -5px rgba(0, 0, 0, 0.24); }
color: rgba(38, 50, 56, 0.75); }
.toolbar.vertical, .inline-toolbar .toolbar, GtkPaned .toolbar, GtkEventBox .toolbar, GtkGrid .toolbar.primary-toolbar {
box-shadow: none; }
.osd .toolbar, .toolbar.osd, .app-notification,
Expand All @@ -1203,7 +1202,7 @@ GtkComboBox {
border-radius: 2px;
box-shadow: none;
color: #ECEFF1;
background-color: #2b2b2b; }
background-color: #FFFFFF; }
.osd .toolbar:backdrop, .toolbar.osd:backdrop, .app-notification:backdrop, GeditViewFrame .gedit-search-slider:backdrop {
border-image: -gtk-scaled(url("assets/osd-shadow-backdrop.png"), url("assets/[email protected]")) 10/10px stretch; }
.osd .toolbar .button:not(:active):not(:insensitive):not(hover), .toolbar.osd .button:not(:active):not(:insensitive):not(hover), .app-notification .button:not(:active):not(:insensitive):not(hover),
Expand Down Expand Up @@ -1291,11 +1290,11 @@ GtkComboBox {
padding: 0.4em;
border-width: 1px 0 1px;
border-style: solid;
border-top-color: #2b2b2b;
border-top-color: #FFFFFF;
border-bottom-color: #242F35;
background-color: #2b2b2b;
background-color: #FFFFFF;
background-clip: border-box;
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar .label:checked:insensitive,
.header-bar .label:checked:insensitive {
color: rgba(236, 239, 241, 0.3); }
Expand All @@ -1312,7 +1311,7 @@ GtkComboBox {
.header-bar .subtitle {
padding-left: 1em;
padding-right: 1em;
color: rgba(236, 239, 241, 0.75);
color: #BBBBBB;
font-size: 90%; }
.titlebar .header-bar-separator, .titlebar > GtkBox > .separator.vertical, .titlebar > GtkBox > GtkBox > .separator.vertical,
.header-bar .header-bar-separator,
Expand All @@ -1324,7 +1323,7 @@ GtkComboBox {
.titlebar .button:not(.suggested-action):not(.destructive-action),
.header-bar .button:not(.suggested-action):not(.destructive-action) {
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(alpha(currentColor, 0.2)), to(transparent)) 0 0 0/0 0 0px;
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar .button:not(.suggested-action):not(.destructive-action):hover,
.header-bar .button:not(.suggested-action):not(.destructive-action):hover {
color: #ECEFF1; }
Expand Down Expand Up @@ -1366,7 +1365,7 @@ GtkComboBox {
.raven .header-bar .raven-header > .button.text-button .label.text-button,
.header-bar .button.destructive-action,
.header-bar .button.destructive-action .label.text-button {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar .button:hover, .titlebar .button .label.text-button:hover,
.titlebar .linked > .button:hover,
.titlebar .linked > .button .label.text-button:hover,
Expand Down Expand Up @@ -1493,7 +1492,7 @@ GtkComboBox {
.titlebar .linked > .entry,
.header-bar .entry,
.header-bar .linked > .entry {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar .entry:focus,
.titlebar .linked > .entry:focus,
.header-bar .entry:focus,
Expand All @@ -1508,7 +1507,7 @@ GtkComboBox {
.titlebar .linked > GtkComboBox.combobox-entry .entry,
.header-bar GtkComboBox.combobox-entry .entry,
.header-bar .linked > GtkComboBox.combobox-entry .entry {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar GtkComboBox.combobox-entry .entry:focus,
.titlebar .linked > GtkComboBox.combobox-entry .entry:focus,
.header-bar GtkComboBox.combobox-entry .entry:focus,
Expand All @@ -1523,7 +1522,7 @@ GtkComboBox {
.titlebar .linked > GtkComboBox.combobox-entry .button,
.header-bar GtkComboBox.combobox-entry .button,
.header-bar .linked > GtkComboBox.combobox-entry .button {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar GtkComboBox.combobox-entry .button:hover,
.titlebar .linked > GtkComboBox.combobox-entry .button:hover,
.header-bar GtkComboBox.combobox-entry .button:hover,
Expand Down Expand Up @@ -2115,7 +2114,7 @@ GtkComboBox {
outline-radius: 100px; }
.titlebar.selection-mode .entry,
.header-bar.selection-mode .entry {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar.selection-mode .entry:focus,
.header-bar.selection-mode .entry:focus {
color: #ECEFF1; }
Expand Down Expand Up @@ -2151,7 +2150,7 @@ GtkComboBox {
.titlebar.default-decoration .button.titlebutton,
.header-bar.default-decoration .button.titlebutton {
padding: 4px;
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.titlebar.default-decoration .button.titlebutton:hover, .titlebar.default-decoration .button.titlebutton:active,
.header-bar.default-decoration .button.titlebutton:hover,
.header-bar.default-decoration .button.titlebutton:active {
Expand All @@ -2163,15 +2162,15 @@ GtkComboBox {
.csd .header-bar, GtkBox .header-bar:only-child {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.26), 0 2px 3px rgba(0, 0, 0, 0.32); }
GtkBox .header-bar:not(:only-child):first-child, GtkBox .header-bar:not(:only-child):last-child {
border-left-color: #2b2b2b;
border-right-color: #2b2b2b; }
border-left-color: #FFFFFF;
border-right-color: #FFFFFF; }
.tiled GtkBox .header-bar:not(:only-child):first-child, .maximized GtkBox .header-bar:not(:only-child):first-child, .tiled GtkBox .header-bar:not(:only-child):last-child, .maximized GtkBox .header-bar:not(:only-child):last-child {
border-left-color: #2b2b2b;
border-right-color: #2b2b2b; }
border-left-color: #FFFFFF;
border-right-color: #FFFFFF; }
GtkBox .header-bar:not(:only-child):last-child:dir(ltr) {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.26), 0 2px 3px rgba(0, 0, 0, 0.32), -5px 0 0 -1px #2b2b2b, -2px 0 0 -1px rgba(0, 0, 0, 0.09); }
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.26), 0 2px 3px rgba(0, 0, 0, 0.32), -5px 0 0 -1px #FFFFFF, -2px 0 0 -1px rgba(0, 0, 0, 0.09); }
GtkBox .header-bar:not(:only-child):last-child:dir(rtl) {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.26), 0 2px 3px rgba(0, 0, 0, 0.32), 5px 0 0 -1px #2b2b2b, 2px 0 0 -1px rgba(0, 0, 0, 0.09); }
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.26), 0 2px 3px rgba(0, 0, 0, 0.32), 5px 0 0 -1px #FFFFFF, 2px 0 0 -1px rgba(0, 0, 0, 0.09); }
GtkPaned .header-bar:not(:only-child):last-child:dir(ltr) {
border-left: 1px solid #242F35; }
GtkPaned .header-bar:not(:only-child):last-child:dir(rtl) {
Expand Down Expand Up @@ -2204,10 +2203,10 @@ GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(rtl) {
.tiled .titlebar, .tiled
.header-bar, .tiled .csd .header-bar, .tiled GtkBox .header-bar:only-child, .tiled GtkBox .header-bar:not(:only-child):last-child:dir(ltr), .tiled GtkBox .header-bar:not(:only-child):last-child:dir(rtl), .tiled GtkPaned .header-bar:not(:only-child):last-child:dir(ltr), .tiled GtkPaned .header-bar:not(:only-child):last-child:dir(rtl), .tiled GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(ltr), .tiled GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(rtl), .window-frame.ssd .tiled .titlebar {
border-radius: 0;
border-color: #2b2b2b;
border-color: #FFFFFF;
border-width: 2px 0 0 0;
border-top-color: #2b2b2b;
background-color: #2b2b2b;
border-top-color: #FFFFFF;
background-color: #FFFFFF;
box-shadow: none; }
.tiled .titlebar:backdrop, .tiled
.header-bar:backdrop, .tiled GtkBox .header-bar:backdrop:only-child, .tiled GtkBox .header-bar:backdrop:not(:only-child):last-child:dir(ltr), .tiled GtkBox .header-bar:backdrop:not(:only-child):last-child:dir(rtl), .tiled GtkPaned .header-bar:backdrop:not(:only-child):last-child:dir(ltr), .tiled GtkPaned .header-bar:backdrop:not(:only-child):last-child:dir(rtl), .window-frame.ssd .tiled .titlebar:backdrop {
Expand All @@ -2216,9 +2215,9 @@ GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(rtl) {
.maximized .titlebar, .maximized
.header-bar, .maximized .csd .header-bar, .maximized GtkBox .header-bar:only-child, .maximized GtkBox .header-bar:not(:only-child):last-child:dir(ltr), .maximized GtkBox .header-bar:not(:only-child):last-child:dir(rtl), .maximized GtkPaned .header-bar:not(:only-child):last-child:dir(ltr), .maximized GtkPaned .header-bar:not(:only-child):last-child:dir(rtl), .maximized GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(ltr), .maximized GtkBox .header-bar.selection-mode:not(:only-child):last-child:dir(rtl), .window-frame.ssd .maximized .titlebar {
border-radius: 0;
border-color: #2b2b2b;
border-color: #FFFFFF;
border-width: 1px 0 0 0;
background-color: #2b2b2b;
background-color: #FFFFFF;
box-shadow: none; }

/************
Expand Down Expand Up @@ -2337,20 +2336,19 @@ column-header.button.dnd, column-header .button.dnd {
.menubar {
-GtkWidget-window-dragging: true;
padding: 0;
box-shadow: inset 0 2px 2px -3px rgba(0, 0, 0, 0.26), inset 0 5px 3px -5px rgba(0, 0, 0, 0.39), inset 0 -1px rgba(0, 0, 0, 0.09);
background-color: #2b2b2b;
color: rgba(236, 239, 241, 0.75); }
background-color: #FFFFFF;
color: #BBBBBB; }
.menubar > .menuitem {
padding: 0.4em 0.6em;
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }
.menubar > .menuitem:hover {
color: #ECEFF1;
box-shadow: inset 0 -2px #E8E8E8; }
.menubar > .menuitem:insensitive {
color: rgba(236, 239, 241, 0.3);
box-shadow: none; }
.tiled .menubar, .maximized .menubar {
background-color: #2b2b2b;
background-color: #FFFFFF;
box-shadow: none; }

.menu {
Expand Down Expand Up @@ -5412,8 +5410,8 @@ GtkVolumeButton.button {
padding: 0.1em 0 0.2em;
border: 1px solid transparent;
border-radius: 0;
color: rgba(236, 239, 241, 0.75);
background-color: #2b2b2b;
color: #BBBBBB;
background-color: #FFFFFF;
transition: none; }
.floating-bar .button {
padding: 0.3em;
Expand Down Expand Up @@ -5875,8 +5873,8 @@ GtkBox > GtkScrlledWindow .undershoot.right {
PanelWidget,
PanelApplet,
PanelToplevel {
color: rgba(236, 239, 241, 0.75);
background-color: #2b2b2b;
color: #BBBBBB;
background-color: #FFFFFF;
box-shadow: none; }

PanelSeparator {
Expand All @@ -5888,7 +5886,7 @@ PanelSeparator {
PanelMenuButton,
PanelApplet > GtkMenuBar.menubar,
ClockBox {
color: rgba(236, 239, 241, 0.75);
color: #BBBBBB;
background-color: transparent;
box-shadow: none;
font-weight: 700; }
Expand All @@ -5906,7 +5904,7 @@ PanelApplet > GtkMenuBar.menubar {
box-shadow: none; }
.gnome-panel-menu-bar .menuitem,
PanelApplet > GtkMenuBar.menubar .menuitem {
color: rgba(236, 239, 241, 0.75);
color: #BBBBBB;
background-color: transparent; }
.gnome-panel-menu-bar .menuitem:hover,
PanelApplet > GtkMenuBar.menubar .menuitem:hover {
Expand Down Expand Up @@ -5944,7 +5942,7 @@ PanelApplet GtkButton#tasklist-button, PanelApplet GtkButton#clock-applet-button
background-color: transparent;
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
padding: 0px 4px;
color: rgba(236, 239, 241, 0.75);
color: #BBBBBB;
background-color: transparent;
border: none;
border-radius: 0; }
Expand All @@ -5964,7 +5962,7 @@ TaskList TaskItem {
background-color: transparent;
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
padding: 0px 4px;
color: rgba(236, 239, 241, 0.75);
color: #BBBBBB;
background-color: transparent;
border: none;
border-radius: 0; }
Expand All @@ -5982,7 +5980,7 @@ TaskList TaskItem {
WpTaskTitle {
background-color: transparent; }
WpTaskTitle .label {
color: rgba(236, 239, 241, 0.75); }
color: #BBBBBB; }

WnckPager:selected {
box-shadow: inset 0 -2px #E8E8E8; }
Expand Down Expand Up @@ -6038,7 +6036,7 @@ GfPopupWindow {
opacity: 0.9; }
FlashbackOsdWindow.background,
GfPopupWindow.background {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #ECEFF1; }

GfInputSourcePopup #input-source {
Expand Down Expand Up @@ -6323,7 +6321,7 @@ GbTerminalView > GtkPaned > GtkScrolledWindow, GbTerminalView > GtkPaned > GtkSc
font-size: 1em; }

GbTerminalView {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #ECEFF1; }

GbSearchDisplayGroup GtkListBox .list-row, GbSearchDisplayGroup GtkListBox .tweak-category {
Expand Down Expand Up @@ -6462,7 +6460,7 @@ ContactsWindow ContactsListPane GtkScrolledWindow .undershoot.right {
******************/
TerminalScreen,
TerminalWindow.background {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #FFFFFF; }

TerminalWindow .scrollbar .slider {
Expand Down Expand Up @@ -6525,17 +6523,17 @@ EvAnnotationWindow {
background-color: transparent; }

.budgie-panel {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #ECEFF1;
font-weight: 700; }
.top .budgie-panel {
border-top: 2px solid #2b2b2b; }
border-top: 2px solid #FFFFFF; }
.bottom .budgie-panel {
border-bottom: 2px solid #2b2b2b; }
border-bottom: 2px solid #FFFFFF; }
.left .budgie-panel {
border-left: 2px solid #2b2b2b; }
border-left: 2px solid #FFFFFF; }
.right .budgie-panel {
border-right: 2px solid #2b2b2b; }
border-right: 2px solid #FFFFFF; }
.budgie-panel .alert {
color: #E8E8E8; }

Expand Down Expand Up @@ -6866,7 +6864,7 @@ GfCandidatePopup .budgie-panel ShowDesktopApplet.linked > .button, .budgie-panel
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.02), inset 0 2px 3px -2px rgba(0, 0, 0, 0.07); }
.raven .powerstrip {
border-top: 1px solid rgba(0, 0, 0, 0.09);
background-color: #2b2b2b;
background-color: #FFFFFF;
box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, 0.02), inset 0 2px 3px -2px rgba(0, 0, 0, 0.07); }
.raven .powerstrip .button {
padding: 1em;
Expand Down Expand Up @@ -7164,7 +7162,7 @@ UnityDecoration {
border-color: rgba(0, 0, 0, 0.09);
border-radius: 2px 2px 0 0;
padding: 1px 6px 0 6px;
background-image: linear-gradient(to bottom, #2b2b2b);
background-image: linear-gradient(to bottom, #FFFFFF);
color: #ECEFF1;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.07); }
UnityDecoration.top:backdrop {
Expand All @@ -7175,9 +7173,9 @@ UnityDecoration {
UnityPanelWidget, UnityPanelWidget:backdrop,
.unity-panel,
.unity-panel:backdrop {
border-bottom: 1px solid #2b2b2b;
border-bottom: 1px solid #FFFFFF;
color: #ECEFF1;
background-image: linear-gradient(to bottom, #2b2b2b);
background-image: linear-gradient(to bottom, #FFFFFF);
box-shadow: none; }

.unity-panel.menubar,
Expand Down Expand Up @@ -7303,7 +7301,7 @@ CcShellCategoryView CcShellItemView.view {
* XFce4 *
*********/
.xfce4-panel {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #ECEFF1;
font-weight: 700; }
.xfce4-panel .button {
Expand All @@ -7329,7 +7327,7 @@ CcShellCategoryView CcShellItemView.view {
-gtk-image-effect: none; }

TopMenuAppMenuBar {
background-color: #2b2b2b;
background-color: #FFFFFF;
color: #ECEFF1;
box-shadow: none; }
TopMenuAppMenuBar > .menuitem {
Expand Down Expand Up @@ -7385,6 +7383,6 @@ GtkWindow > GtkBox.vertical > GtkBox.horizontal > GtkAlignment {
@define-color error_color #F44336;
@define-color success_color #00E676;
@define-color link_color #E8E8E8;
@define-color wm_bg_a #2b2b2b;
@define-color wm_bg_a #FFFFFF;
@define-color wm_bg_b rgba(255, 255, 255, 0.07);
@define-color content_view_bg #FFFFFF;
Loading

0 comments on commit a00244e

Please sign in to comment.