wintergreen-theme/themes/Wintergreen/gtk-3.0/gtk-widgets.css

895 lines
18 KiB
CSS

/**
* Copyright (c) 2017 Vlasta Vesely <vlastavesely@protonmail.ch>
*
* This file is part of Raleigh Reloaded GTK theme.
*
* This is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License version 2
* as published by the Free Software Foundation.
*
* This program 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 this program. If not, see <http://www.gnu.org/licenses/>.
*/
/***********
* general *
***********/
* {
-gtk-icon-style: regular; /* disable symbolic icons */
}
.background {
background-color: @theme_bg_color;
color: @theme_fg_color;
}
*:disabled {
color: #393b39;
-gtk-icon-effect: dim;
}
.flat:not(:hover):not(:checked) {
border: 0;
}
/*************
* selection *
*************/
selection,
*:selected,
.view:selected {
background: @theme_bg_color;
color: @theme_fg_color;
}
selection:focus,
*:selected:focus,
.view:selected:focus,
*:focus *:selected {
background-color: @theme_selected_bg_color;
color: @theme_selected_fg_color;
}
.rubberband,
.view.rubberband,
rubberband {
background-color: alpha(@theme_selected_bg_color, 0.3);
border: 1px solid @theme_selected_bg_color;
}
/***********
* buttons *
***********/
button, .button {
background: @button_bg_color;
border-image: url("assets/button.png") 3 / 3px stretch;
color: @theme_fg_color;
padding: 5px;
}
button:hover, .button:hover {
background-color: shade(@button_bg_color, 1.05);
}
button:active, .button:active,
button:active:hover, .button:active:hover,
button.toggle:checked,
button.toggle:active:hover,
stackswitcher button:checked {
background-color: @button_bg_color;
border-image-source: url("assets/button-pressed.png");
}
button:focus, .button:focus {
border-image-source: url("assets/button-focus.png");
}
button:disabled, .button:disabled {
background-color: @theme_bg_color;
border-image-source: url("assets/button-disabled.png");
}
button.link {
color: @link_color;
}
button.link > label {
text-decoration-line: underline;
}
button.color * {
border-image: url("assets/frame-etched-out.png") 2 / 2px stretch;
margin: 0 .3em;
min-height: 1.2em;
}
/**************
* scrollbars *
**************/
scrollbar button,
scrollbar button:hover,
scrollbar button:active,
scrollbar button:active:hover,
scrollbar button:disabled {
background: @theme_bg_color no-repeat;
color: black;
font-size: .8em;
min-height: .8rem;
min-width: .8rem;
padding: 2px;
}
scrollbar button:disabled {
color: shade(@theme_bg_color, .6);
}
scrollbar slider {
background: @button_bg_color;
border-image: url("assets/button.png") 2 / 2px stretch;
}
scrollbar slider:hover {
}
scrollbar.vertical slider {
min-height: .5rem;
min-width: .8rem;
padding: 2px;
}
scrollbar.horizontal slider {
min-height: .8rem;
min-width: .5rem;
padding: 2px;
}
scrollbar.vertical button.up {
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
}
scrollbar.vertical button.down {
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}
scrollbar.horizontal button.up {
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
}
scrollbar.horizontal button.down {
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
}
/*********************
* checks and radios *
*********************/
check, radio, .view.cellradio {
margin: .3em .4em .3em .3em;
min-height: 13px;
min-width: 13px;
}
checkbutton:hover, radiobutton:hover {
background-color: shade(@theme_bg_color, 1.05);
}
checkbutton label, radiobutton label {
padding-right: .5em;
}
check {
-gtk-icon-source: url("assets/check.png");
}
check:checked {
-gtk-icon-source: url("assets/check-checked.png");
}
check:checked:disabled {
-gtk-icon-source: url("assets/check-checked-disabled.png");
}
check:disabled {
-gtk-icon-source: url("assets/check-disabled.png");
}
check:indeterminate {
-gtk-icon-source: url("assets/check-indeterminate.png");
}
check:indeterminate:disabled {
-gtk-icon-source: url("assets/check-indeterminate-disabled.png");
}
radio, .view.cellradio {
-gtk-icon-source: url("assets/radio.png");
}
radio:checked {
-gtk-icon-source: url("assets/radio-checked.png");
}
radio:disabled {
-gtk-icon-source: url("assets/radio-disabled.png");
}
radio:checked:disabled {
-gtk-icon-source: url("assets/radio-checked-disabled.png");
}
radio:indeterminate {
-gtk-icon-source: url("assets/radio-indeterminate.png");
}
radio:indeterminate:disabled {
-gtk-icon-source: url("assets/radio-indeterminate-disabled.png");
}
/****************
* text entries *
****************/
entry {
background: #d0cb96;
border-image: url("assets/entry.png") 2 / 2px stretch;
padding: .35em;
}
entry:disabled {
background-color: @theme_bg_color;
border-image: none;
}
/****************
* spin buttons *
****************/
spinbutton {
background: @theme_bg_color;
border-image: url("assets/entry.png") 2 / 2px stretch;
}
spinbutton button {
min-width: 2em;
}
/**************
* comboboxes *
**************/
combobox arrow {
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
color: @theme_fg_color;
margin: -2px;
}
combobox button:first-child arrow {
border-image: url("assets/combobox-arrow-separator.png") 2 / 2px stretch;
padding: 3px;
padding-left: 5px;
}
/*********
* menus *
*********/
menubar {
-GtkWidget-window-dragging: true;
padding: 1px;
}
menubar decoration,
.popup decoration {
border: 0;
}
menu {
background: @theme_bg_color;
border: solid 2px;
border-image: url("assets/menu.png") 3 / 3px stretch;
padding: 1px;
}
menubar > menuitem {
margin: 0;
padding: .3em .4em;
}
menubar > menuitem:hover {
background: @theme_selected_bg_color;
color: @theme_selected_fg_color;
}
menuitem {
margin: 1px;
padding: 3px;
}
menuitem:hover {
background-color: @theme_selected_bg_color;
color: @theme_selected_fg_color;
}
menu separator {
border-image: url("assets/separator-horizontal.png") 1 / 1px stretch;
min-height: 1px;
margin: .2em .4em;
}
menuitem > image {
min-height: 1em;
min-width: 1em;
}
menuitem > arrow {
font-size: 1.2em;
margin: -.2em 0 -.2em 1em;
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
}
menu arrow.top,
.menu arrow.top {
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
}
menu arrow.bottom,
.menu arrow.bottom {
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}
/*************
* notebooks *
*************/
notebook {
padding: 0;
}
notebook.frame {
border-image: url("assets/notebook.png") 3 / 3px stretch;
}
notebook header {
background: @theme_bg_color;
}
notebook header.top {
border-image: url("assets/notebook-header-top.png") 2 / 2px stretch;
padding-bottom: 2px;
}
notebook header.bottom {
border-image: url("assets/notebook-header-bottom.png") 2 / 2px stretch;
padding-top: 2px;
}
notebook header.left {
border-image: url("assets/notebook-header-left.png") 2 / 2px stretch;
padding-right: 2px;
}
notebook header.right {
border-image: url("assets/notebook-header-right.png") 2 / 2px stretch;
padding-left: 2px;
}
notebook header.top tabs {
margin-top: 2px;
}
notebook header.bottom tabs {
margin-bottom: 2px;
}
notebook header.left tabs {
margin-left: 2px;
}
notebook header.right tabs {
margin-right: 2px;
}
notebook tab,
notebook.frame > .frame {
background: @button_bg_color;
padding: .3em .4em;
}
notebook header.top tab,
notebook.frame > .frame.top {
border-image: url("assets/notebook-tab-top.png") 2 / 2px stretch;
}
notebook header.bottom tab,
notebook.frame > .frame.bottom {
border-image: url("assets/notebook-tab-bottom.png") 2 / 2px stretch;
}
notebook header.left tab,
notebook.frame > .frame.left {
border-image: url("assets/notebook-tab-left.png") 2 / 2px stretch;
}
notebook header.right tab,
notebook.frame > .frame.right {
border-image: url("assets/notebook-tab-right.png") 2 / 2px stretch;
}
notebook header tab:checked,
notebook.frame > .frame:active {
background: @button_bg_color;
}
notebook header.top tab:checked {
margin-top: -2px;
}
notebook header.bottom tab:checked {
margin-bottom: -2px;
margin-top: -2px;
}
notebook header.left tab:checked {
margin-left: -2px;
margin-right: -1px;
}
notebook header.right tab:checked {
margin-left: -2px;
margin-right: -2px;
}
notebook tab button {
background-color: transparent;
border: 0;
}
notebook.frame > .frame {
padding: .15rem;
}
/**********
* Arrows *
**********/
arrow {
min-width: 1.2rem;
min-height: 1.2rem;
}
/************
* expander *
************/
expander arrow {
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
}
expander arrow:checked {
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}
/********************************
* CSD header and window border *
********************************/
headerbar {
background-color: @theme_bg_color;
border-bottom: solid 1px shade(@theme_bg_color, .8);
padding: 7px;
}
decoration {
background-color: @theme_bg_color;
border: solid 3px @theme_bg_color;
border-image: url("assets/button.png") 3 / 3px stretch;
}
/****************************
* application notification *
****************************/
.app-notification {
background-color: @theme_info_bg_color;
border-image: url("assets/frame-etched-out.png") 3 / 3px stretch;
padding: 7px;
}
.app-notification border {
border: 0;
}
/************
* popovers *
************/
popover {
border: solid 1px shade(@theme_bg_color, 0.5);
}
popover .flat {
padding: 5px;
}
/***********
* toolbar *
***********/
toolbar {
background: @theme_bg_color;
padding: 4px;
}
toolbar separator {
border-image: url("assets/separator-vertical.png") 1 / 1px stretch;
margin: 5px;
padding: 1px;
}
toolbar button {
background-color: @theme_bg_color;
}
/*************
* statusbar *
*************/
statusbar button {
padding: 2px;
}
statusbar button:active:hover,
statusbar button.toggle:checked,
statusbar button.toggle:active:hover {
padding: 3px 1px 1px 3px;
}
statusbar frame,
statusbar > label {
border-image: url("assets/statusbar-frame.png") 2 / 2px stretch;
}
statusbar frame {
padding: 0;
}
statusbar frame > border {
border: 0;
}
statusbar {
margin: 0 -9px;
}
/*************
* listboxes *
*************/
list row {
padding: 5px;
}
list row:hover {
background-color: shade(@theme_bg_color, 1.05);
}
/**************
* separators *
**************/
separator.horizontal {
border-image: url("assets/separator-horizontal.png") 1 / 1px stretch;
padding: 1px;
}
separator.vertical {
border-image: url("assets/separator-vertical.png") 1 / 1px stretch;
padding: 1px;
}
/*********
* paned *
*********/
paned > separator {
background: url("assets/paned-separator-vertical.png") no-repeat center;
-gtk-icon-source: none;
padding: 1px;
}
paned > separator:hover {
background-color: shade(@theme_bg_color, 1.05);
}
paned.vertical > separator {
background-image: url("assets/paned-separator-horizontal.png");
}
/**********
* frames *
**********/
frame > border {
border-image: url("assets/frame-etched-out.png") 2 / 2px stretch;
padding: 2px;
}
frame { /* LibreOffice combobox's dropdown */
border-image: url("assets/menu.png") 3 / 3px stretch;
padding: 3px;
}
box > frame,
grid > frame {
border: 0;
padding: 0;
}
viewport.frame {
border-image: url("assets/frame-etched-out.png") 3 / 3px stretch;
}
scrolledwindow > viewport,
scrolledwindow > viewport.frame {
border: 0;
}
/**************
* button box *
**************/
buttonbox.horizontal button {
margin: .2em .4em;
}
buttonbox.horizontal button:first-child {
margin-left: 0;
}
buttonbox.horizontal button:last-child {
margin-right: 0;
}
progressbar trough,
levelbar trough,
scale trough,
treeview.view.trough,
treeview.view.trough:selected,
scrollbar {
background-color: #74847e;
border: solid 1px black;
color: @theme_fg_color;
}
/*********
* scale *
*********/
scale {
margin: 1px;
}
scale slider {
background: @theme_bg_color no-repeat center;
border-image: url("assets/scale-slider-border.png") 2 / 2px stretch;
}
scale slider:hover {
background-color: shade(@theme_bg_color, 1.05);
}
scale trough:disabled {
background-color: @theme_bg_color;
}
scale.horizontal trough {
padding: 0 1.2em;
}
scale.vertical trough {
padding: 1.2em 0;
}
scale.horizontal slider {
background-image: url("assets/scale-slider-horizontal.png");
min-height: 1em;
min-width: 2.4em;
}
scale.vertical slider {
background-image: url("assets/scale-slider-vertical.png");
min-height: 2.4em;
min-width: 1em;
}
scale.horizontal mark indicator {
background-color: shade(@theme_bg_color, 0.56);
min-height: 8px;
min-width: 1px;
}
scale.vertical mark indicator {
background-color: shade(@theme_bg_color, 0.56);
min-height: 1px;
min-width: 8px;
}
/***************
* color scale *
***************/
scale.color trough {
padding: 0;
}
scale.color slider {
background-color: transparent;
border: 0;
}
scale.color.horizontal slider {
background-image: url("assets/color-scale-slider-horizontal.png");
min-height: 14px;
min-width: 16px;
}
scale.color.vertical slider {
background-image: url("assets/color-scale-slider-vertical.png");
min-height: 16px;
min-width: 14px;
}
/***************
* progressbar *
***************/
progressbar {
font-size: .8em;
}
progressbar trough {
padding: 1px;
}
progressbar progress,
treeview.view.progressbar {
background: @theme_selected_bg_color;
border-image: url("assets/progress.png") 2 / 2px stretch;
color: @theme_selected_fg_color;
}
progressbar.horizontal,
progressbar.horizontal progress,
progressbar.horizontal trough {
min-height: 1.3em;
}
progressbar.vertical,
progressbar.vertical progress,
progressbar.vertical trough {
min-width: 1.3em;
}
treeview.view.trough {
padding: 2px;
}
/************
* levelbar *
************/
levelbar block {
margin: 1px;
padding: 3px;
}
levelbar block.filled {
background: @theme_selected_bg_color;
border-image: url("assets/progress.png") 2 / 2px stretch;
}
/**********
* switch *
**********/
switch {
background-color: shade(@theme_bg_color, .9);
border-image: url("assets/button-pressed.png") 3 / 3px stretch;
min-height: 2em;
}
switch slider {
background-color: @theme_bg_color;
border-image: url("assets/button.png") 3 / 3px stretch;
margin: 2px;
padding: .3em;
}
switch:checked {
background: @theme_selected_bg_color;
color: @theme_selected_fg_color;
}
/************
* treeview *
************/
.view {
background: @theme_base_color;
}
.sidebar,
scrolledwindow,
scrolledwindow.frame {
border-image: url("assets/frame-etched-in.png") 3 / 3px stretch;
padding: 2px;
}
/************
* tooltips *
************/
tooltip,
tooltip.background {
background-color: @theme_tooltip_bg_color;
border: solid 1px alpha(@theme_tooltip_fg_color, .3);
color: alpha(@theme_tooltip_fg_color, .8);
}
tooltip *, .tooltip * {
background-color: transparent;
}
tooltip decoration {
border: 0;
}
/*************
* calendars *
*************/
calendar {
padding: 2px;
}
calendar.header {
background: @theme_bg_color;
}
calendar.view {
border-image: url("assets/frame-etched-out.png") 2 / 2px stretch;
}
calendar:indeterminate {
color: alpha(@theme_fg_color, 0.4);
}
calendar.highlight {
background-color: @theme_selected_bg_color;
color: @theme_selected_fg_color;
}
/************
* infobars *
************/
.info {
background-color: @theme_info_bg_color;
}
.warning {
background-color: @theme_warning_bg_color;
}
.error {
background-color: @theme_error_bg_color;
}
.info, .warning, .error {
border-image: url("assets/frame-etched-out.png") 3 / 3px stretch;
}
/**************
* actionbars *
**************/
actionbar {
border-top: solid 1px shade(@theme_bg_color, .8);
padding: 7px;
}
/***********
* sidebar *
***********/
.sidebar {
background: white;
}
.sidebar label {
padding: .3em 1em;
}
.sidebar label.highlight {
font-weight: bold;
}
/***********************
* file chooser dialog *
***********************/
dialog filechooser placessidebar.sidebar {
background: @theme_bg_color;
}
dialog filechooser placessidebar.sidebar.frame .sidebar-row {
padding: .3em 1em;
}
dialog filechooser .frame.sidebar .sidebar-row label {
padding: 0;
padding-left: .8em;
}
dialog filechooser placessidebar button {
background: transparent;
border: 0;
padding: 0;
}
dialog filechooser placessidebar.sidebar viewport {
border: none;
}
dialog filechooser placessidebar *:hover button {
background-color: transparent;
}
dialog filechooser stack {
background: @theme_bg_color;
}
dialog filechooser .path-bar .slider-button,
dialog filechooser .path-bar .slider-button:active {
padding: 5px 0;
}
dialog filechooser .path-bar image {
margin-right: 5px;
}
dialog filechooser .frame.sidebar separator {
border-image: url("assets/separator-horizontal.png") 1 / 1px stretch;
margin: 3px 5px;
padding: 1px;
}
dialog filechooser actionbar {
border: solid 1px shade(@theme_bg_color, .6);
margin-top: 5px;
padding: 7px;
}
dialog filechooser frame {
padding: 0;
}
dialog filechooser frame border {
border: 0;
}
/*****************
* color chooser *
*****************/
dialog colorchooser colorswatch {
border-image: url("assets/frame-etched-out.png") 2 / 2px stretch;
padding: 2px;
}
dialog colorchooser colorswatch.dark * {
color: white;
}
dialog colorchooser colorswatch.light * {
color: black;
}
dialog colorchooser #add-color-button {
border-image: url("assets/button.png") 3 / 3px stretch;
}
dialog colorchooser colorswatch:selected * {
background: transparent;
}
colorchooser .popover {
background: @theme_bg_color;
border-image: url("assets/button.png") 3 / 3px stretch;
}
*:disabled colorswatch {
opacity: .4;
}
/****************
* print dialog *
****************/
printdialog > box > box {
padding: 5px;
}
printdialog box {
background: @theme_bg_color;
}
printdialog notebook stack {
border-image: url("assets/notebook.png") 3 / 3px stretch;
padding: 2px;
}
printdialog paper {
background-color: @theme_base_color;
border: solid 1px shade(@theme_bg_color, .6);
}
/*********************
* Spinner Animation *
*********************/
@keyframes spin {
to { -gtk-icon-transform: rotate(1turn); }
}
spinner {
background-color: transparent;
opacity: 0;
}
spinner:checked {
opacity: 1;
animation: spin 1s linear infinite;
}
/*******
* OSD *
*******/
.background.osd {
background: rgba(0,0,0,.5);
border-radius: 1rem;
}
.osd .trough {
background: rgba(255,255,255,.5);
border-radius: 6px;
}
.osd .progressbar {
background: white;
border-radius: 6px;
}