paper-gtk-theme/Paper/gtk-3.0/widgets/header-bar.css

/* Copyright 2015 Sam Hewitt.
*
* This file is part of the Paper GTK theme.
*
* The Paper GTK theme is free software: you can redistribute it
* and/or modify it under the terms of the GNU General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* The Paper GTK theme is distributed in the hope that it will be
* useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General
* Public License for more details.
*
* You should have received a copy of the GNU General Public License along
* with the Paper GTK theme. If not, see http://www.gnu.org/licenses/.
*/


/**************
 * Header Bar *
 **************/

.header-bar {
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 0px;
    background-image: none;
    background-color: @header;
    color: @header_text;
    box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.1);
}


.maximized .header-bar {
    border-radius: 0px;
    box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.1);
}

.header-bar:backdrop {
    background-image: none;
    background-color: @backdrop_header;
    color: @backdrop_header_text;
    box-shadow: none;
}

.header-bar *:insensitive {
    color: @insensitive_header_text;
}

/* Title */
.header-bar .title {
    padding-left: 13px;
    padding-right: 13px;
    font: Bold 11;
    color: @header_text;
}

.header-bar .title:backdrop {
    color: @backdrop_header_text;
}


/* Subtitle */
.header-bar .subtitle {
    font: 9;
}

.header-bar .subtitle,
.header-bar .subtitle GtkLabel,
.header-bar .subtitle GtkImage {
    color: alpha(@header_text, 0.8);
}

.header-bar .subtitle:backdrop,
.header-bar .subtitle:backdrop GtkLabel,
.header-bar .subtitle:backdrop GtkImage  {
    color: alpha(@backdrop_header_text,0.8);
}

/* Separator */
.header-bar .separator {
    background: none;
    color: transparent;
}

/**********************
 * Header bar buttons *
 **********************/
.header-bar .button {
    border: none;
    padding: 12px 15px;
}

.header-bar .flat,
.header-bar .button,
.header-bar .title,
.header-bar .titlebutton,
.header-bar .linked,
.header-bar .text-button,
.header-bar .image-button {
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    transition: all 300ms cubic-bezier(0.3, 0.5, 0.5, 0.9);
}

/* Normal Button */
.header-bar .button,
.header-bar .text-button,
.header-bar .titlebutton,
.header-bar .linked,
.header-bar .flat,
.header-bar .suggested-action .button,
.header-bar .image-button {
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: none;
    box-shadow: none;
    outline: none;
    color: @header_text;
}

/* Active Button */
.header-bar .button:active,
.header-bar .text-button:active,
.header-bar .titlebutton:active,
.header-bar .linked:active,
.header-bar .flat:active,
.header-bar .suggested-action .button:active,
.header-bar .image-button:active {
    border-radius: 0px;
    background-color: alpha(#000, 0.1);
    background-image: none;
    border: none;
    outline: none;
    color: @header_text;
    box-shadow: inset 0 -2px 0 0 @header_text;
}

.header-bar .text-button:active {
    font: Bold;
}

/* Checked Button */
.header-bar .button:checked,
.header-bar .text-button:checked,
.header-bar .titlebutton:checked,
.header-bar .linked:checked,
.header-bar .flat:checked,
.header-bar .suggested-action .button:checked,
.header-bar .image-button:checked {
    border-radius: 0px;
    background-image: none;
    border: none;
    outline: none;
    color: @header_text;
    box-shadow: inset 0 -2px 0 0 @header_text;
}

.header-bar .text-button:checked {
    font: Bold;
}

/* Focus Button */
.header-bar .button:focus,
.header-bar .text-button:focus,
.header-bar .titlebutton:focus,
.header-bar .linked:focus,
.header-bar .flat:focus,
.header-bar .suggested-action .button:focus,
.header-bar .image-button:focus {
    border-radius: 0px;
    background-color: transparent;
    background-image: none;
    border: none;
    outline: none;
    color: @header_text;
    box-shadow: inset 0 -2px 0 0 @header_text;
}

/* Hover Button */
.header-bar .button:hover,
.header-bar .text-button:hover,
.header-bar .titlebutton:hover,
.header-bar .linked:hover,
.header-bar .flat:hover,
.header-bar .suggested-action .button:hover,
.header-bar .image-button:hover {
    border-radius: 0px;
    background-color: alpha(#000, 0.1);
    background-image: none;
    border: none;
    outline: none;
    box-shadow: inset 0 -2px 0 0 @header_text;
    color: @header_text;
}

/* Backdrop Button */
.header-bar .button:backdrop,
.header-bar .text-button:backdrop,
.header-bar .titlebutton:backdrop,
.header-bar .linked:backdrop,
.header-bar .flat:backdrop,
.header-bar .suggested-action .button:backdrop,
.header-bar .image-button:backdrop {
    border-radius: 0px;
    background-color: transparent;
    background-image: none;
    border: none;
    box-shadow: none;
    outline: none;
    color: @backdrop_header_text;
}

/* *:Backdrop Button */
.header-bar .button:hover:backdrop,
.header-bar .text-button:hover:backdrop,
.header-bar .titlebutton:hover:backdrop,
.header-bar .linked:hover:backdrop,
.header-bar .flat:hover:backdrop,
.header-bar .suggested-action .button:hover:backdrop,
.header-bar .image-button:hover:backdrop,
.header-bar .button:checked:backdrop,
.header-bar .text-button:checked:backdrop,
.header-bar .titlebutton:checked:backdrop,
.header-bar .linked:checked:backdrop,
.header-bar .flat:checked:backdrop,
.header-bar .suggested-action .button:checked:backdrop,
.header-bar .image-button:checked:backdrop,
.header-bar .button:focus:backdrop,
.header-bar .text-button:focus:backdrop,
.header-bar .titlebutton:focus:backdrop,
.header-bar .linked:focus:backdrop,
.header-bar .flat:focus:backdrop,
.header-bar .suggested-action .button:focus:backdrop,
.header-bar .image-button:focus:backdrop,
.header-bar .button:active:backdrop,
.header-bar .text-button:active:backdrop,
.header-bar .titlebutton:active:backdrop,
.header-bar .linked:active:backdrop,
.header-bar .flat:active:backdrop,
.header-bar .suggested-action .button:active:backdrop,
.header-bar .image-button:active:backdrop {
    border-radius: 0px;
    background-color: transparent;
    background-image: none;
    border: none;
    outline: none;
    color: @backdrop_header_text;
    box-shadow: inset 0 -2px 0 0 @backdrop_header_text;
}

.header-bar .text-button:active:backdrop {
    font: Bold;
}

/* Backdrop:Hover Button */
.header-bar .button:backdrop:hover,
.header-bar .text-button:backdrop:hover,
.header-bar .titlebutton:backdrop:hover,
.header-bar .linked:backdrop:hover,
.header-bar .flat:backdrop:hover,
.header-bar .suggested-action .button:backdrop:hover,
.header-bar .image-button:backdrop:hover {
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: none;
    outline: none;
    box-shadow: inset 0 -2px 0 0 @backdrop_header_text;
    color: @backdrop_header_text;
}

/* Insensitive Button */
.header-bar .button:insensitive,
.header-bar .text-button:insensitive,
.header-bar .titlebutton:insensitive,
.header-bar .linked:insensitive,
.header-bar .flat:insensitive,
.header-bar .suggested-action .button:insensitive,
.header-bar .image-button:insensitive {
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: none;
    box-shadow: none;
    outline: none;
    color: @insensitive_header_text;
}

/* Insensitive:Backdrop Button */
.header-bar .button:insensitive:backdrop,
.header-bar .text-button:insensitive:backdrop,
.header-bar .titlebutton:insensitive:backdrop,
.header-bar .linked:insensitive:backdrop,
.header-bar .flat:insensitive:backdrop,
.header-bar .suggested-action .button:insensitive:backdrop,
.header-bar .image-button:insensitive:backdrop {
    border-radius: 0px;
    background-color: transparent;
    background-image: none;
    border: none;
    outline: none;
    color: @insensitive_header_text;
}



/* Button Images */
.header-bar .button GtkImage,
.header-bar .button GtkImage:active,
.header-bar .button GtkImage:focus,
.header-bar .button GtkImage:hover {
    color: @header_text;
}

.header-bar .button GtkImage:active:backdrop,
.header-bar .button GtkImage:backdrop,
.header-bar .button GtkImage:backdrop:hover {
    color: @backdrop_header_text;
    -gtk-image-effect: dim;
}

.header-bar .button GtkImage:insensitive {
    color: @insensitive_header_text;
    -gtk-image-effect: dim;
}

.header-bar .button GtkImage:insensitive:backdrop {
    color: mix(@backdrop_toolbar_text, @insensitive_toolbar_text, 0.5);
    -gtk-image-effect: dim;
}

/* Button Labels */
.header-bar .button GtkLabel,
.header-bar .button GtkLabel:active,
.header-bar .button GtkLabel:focus,
.header-bar .button GtkLabel:hover {
    color: @header_text;
}

.header-bar .button GtkLabel:active:backdrop,
.header-bar .button GtkLabel:backdrop,
.header-bar .button GtkLabel:backdrop:hover {
    color: @backdrop_header_text;
    -gtk-image-effect: dim;
}

.header-bar .button GtkLabel:insensitive {
    color: @insensitive_header_text;
    -gtk-image-effect: dim;
}

.header-bar .button GtkLabel:insensitive:backdrop {
    color: mix(@backdrop_toolbar_text, @insensitive_toolbar_text, 0.5);
    -gtk-image-effect: dim;
}


/*************************
 * Header bar separator  *
 *************************/

.header-bar > GtkBox > .separator.vertical {
    -GtkWidget-wide-separators: 1;
    -GtkWidget-separator-width: 0;
    background-color: @separator;
    color: @separator;
    border:none;
}

/* Separator */
.header-bar .separator,
.header-bar .button .separator,
.header-bar .button.separator {
    background: none;
    color: transparent;
    border:none;
} 


/********************
 * Header bar entry *
 ********************/

.header-bar .entry {
    background: none;
    color: @header_text;
    padding: 13px;
    border-radius: 0px;
    border: 1px solid transparent;
    outline: none;
    box-shadow: none;
}

.header-bar .entry:active,
.header-bar .entry:focus {
    background: none;
    color: @header_text;
    border: none;
    outline: none;
}

.header-bar .entry:backdrop {
    background: none;
    color: @backdrop_header_text;
    border: none;
    outline: none;
}

.header-bar .entry:selected,
.header-bar .entry:selected:focus {
    color: @header;
    background-color: @header_text;
}

.header-bar .entry.image {
    color: @insensitive_base;
}

.header-bar .entry.image.left {
    padding-right: 6px;
    color: @header_text;
}


/*********************
 * Header bar switch *
 *********************/

.header-bar GtkSwitch {
    border-radius: 1em;
    font: bold;
}

/* Trough */
.header-bar GtkSwitch.trough {
    background: none;
    border: none;
    background-color: alpha(@header_text, 0.2);
    color: @insensitive_header_text;
    background-image: none;
}

.header-bar GtkSwitch.trough:active {
    background: none;
    border: none;
    background-color: alpha(@header_text, 0.2);
    color: @header_text;
    background-image: none;
}

.header-bar GtkSwitch.trough:backdrop,
.header-bar GtkSwitch.trough:active:backdrop {
    background: none;
    border: none;
    background-color: alpha(@header_text, 0.1);
    color: @backdrop_header_text;
    background-image: none;
}

.header-bar GtkSwitch.trough:insensitive,
.header-bar GtkSwitch.trough:active:insensitive {
    background: none;
    background: none;
    border: none;
    color: @insensitive_header_text;
    background-image: none;
}

/* Slider */
.header-bar GtkSwitch.slider,
.header-bar GtkSwitch.slider:active {
    background: none;
    border: none;
    background-color: @header_text;
    background-image: none;
    color: @header_text;
}

.header-bar GtkSwitch.slider:active:insensitive,
.header-bar GtkSwitch.slider:insensitive {
    background: none;
    border: none;
    background-color: @insensitive_header_text;
    background-image: none;
    color: @insensitive_header_text;
}

.header-bar GtkSwitch.slider:active:backdrop,
.header-bar GtkSwitch.slider:backdrop {
    background: none;
    border: none;
    background-color: @backdrop_header_text;
    background-image: none;
    color: @backdrop_header_text;
}