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

499 lines
12 KiB
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;
}