258 lines
8.5 KiB
CSS
258 lines
8.5 KiB
CSS
/***********
|
|
* Buttons *
|
|
***********/
|
|
|
|
/*
|
|
Contributor notes:
|
|
Please use two space indentions.
|
|
Stack all related and child selectors and selector states into a logical hierarchy to a readable degree.
|
|
Make sure that all changes made here are part of the GtkButton.
|
|
*/
|
|
|
|
/* Basic buttons */
|
|
button {
|
|
min-height: 14px;
|
|
min-width: 14px;
|
|
padding: 2px;
|
|
border: 1px solid;
|
|
border-radius: 0px;
|
|
transition: none;
|
|
color: @button_text_color;
|
|
outline-color: @outline_color;
|
|
border-top-color: @border_bright;
|
|
border-right-color: @border_dark;
|
|
border-left-color: @border_bright;
|
|
border-bottom-color: @border_dark;
|
|
background-color: @button_bg_color;
|
|
box-shadow: inset -1px -1px @border_shade, inset 1px 1px @border_light; }
|
|
button:hover {
|
|
-gtk-icon-effect: highlight; }
|
|
button:active,
|
|
button:checked,
|
|
button:disabled:active,
|
|
button:disabled:checked {
|
|
border-top-color: @border_dark;
|
|
border-right-color: @border_bright;
|
|
border-left-color: @border_dark;
|
|
border-bottom-color: @border_bright;
|
|
box-shadow: inset 1px 1px @border_shade; }
|
|
|
|
/* Sidebar buttons */
|
|
button.sidebar-button {
|
|
color: @text_color_light;
|
|
border-top: 1px solid @border_color;
|
|
border-left: 1px solid @border_color;
|
|
box-shadow: inset 1px 1px @border_bright, inset -1px -1px @border_shade;
|
|
transition: none; }
|
|
button.sidebar-button:hover,
|
|
button.sidebar-button:checked,
|
|
button.sidebar-button:active {
|
|
color: @text_color; }
|
|
|
|
/* Dialogue buttons. */
|
|
/* We're using border images here since dialog button borders are 3px on Windows 95 with individual colour properties.*/
|
|
.dialog-action-area button {
|
|
min-height: 16px;
|
|
min-width: 16px;
|
|
box-shadow: none;
|
|
border: 3px solid @border_dark;
|
|
border-image: url("buttons/dialog_button_normal.png");
|
|
border-image-slice: 3 3 3 3; }
|
|
.dialog-action-area button:focus {
|
|
border-image: url("buttons/dialog_button_focus.png");
|
|
border-image-slice: 3 3 3 3; }
|
|
.dialog-action-area button:disabled {
|
|
border-image: url("buttons/dialog_button_normal.png");
|
|
border-image-slice: 3 3 3 3; }
|
|
.dialog-action-area button:active,
|
|
.dialog-action-area button:checked,
|
|
.dialog-action-area button:disabled:active,
|
|
.dialog-action-area button:disabled:checked {
|
|
border-image: url("buttons/dialog_button_active.png");
|
|
border-image-slice: 3 3 3 3; }
|
|
|
|
/* Row buttons */
|
|
row:selected button:selected {
|
|
border-top-color: @border_dark;
|
|
border-right-color: @border_bright;
|
|
border-left-color: @border_dark;
|
|
border-bottom-color: @border_bright;
|
|
box-shadow: inset 1px 1px @border_shade; }
|
|
|
|
/* Stack switcher buttons */
|
|
.stack-switcher > button {
|
|
outline-offset: -3px; }
|
|
.stack-switcher > button > label {
|
|
padding-left: 6px;
|
|
padding-right: 6px; }
|
|
.stack-switcher > button > image {
|
|
padding-left: 6px;
|
|
padding-right: 6px;
|
|
padding-top: 3px;
|
|
padding-bottom: 3px; }
|
|
.stack-switcher > button.text-button {
|
|
padding-left: 10px;
|
|
padding-right: 10px; }
|
|
.stack-switcher > button.image-button {
|
|
padding-left: 2px;
|
|
padding-right: 2px; }
|
|
.stack-switcher > button.needs-attention:active > label,
|
|
.stack-switcher > button.needs-attention:active > image, .stack-switcher > button.needs-attention:checked > label,
|
|
.stack-switcher > button.needs-attention:checked > image {
|
|
background-image: none; }
|
|
|
|
/* Colour swatch buttons */
|
|
button.color {
|
|
padding: 2px; }
|
|
button.color colorswatch {
|
|
padding: 0px;}
|
|
button.color colorswatch:only-child {
|
|
border-color: @border_shade;
|
|
box-shadow: none; }
|
|
button.color colorswatch:only-child, button.color colorswatch:only-child overlay {
|
|
border-radius: 0; }
|
|
button.color colorswatch:only-child:disabled colorswatch:only-child, button.color colorswatch:only-child:backdrop colorswatch:only-child, button.color colorswatch:only-child:active colorswatch:only-child, button.color colorswatch:only-child:checked colorswatch:only-child {
|
|
box-shadow: none; }
|
|
|
|
/* Toolbar buttons */
|
|
.inline-toolbar button,
|
|
.primary-toolbar button,
|
|
toolbutton button,
|
|
toolbutton .toggle,
|
|
.path-bar button {
|
|
margin: 0px;
|
|
border-radius: 0px;
|
|
border-left: 1px solid @border_bright;
|
|
border-top: 1px solid @border_bright;
|
|
border-bottom: 1px solid @border_dark;
|
|
border-right: 1px solid @border_dark;
|
|
box-shadow: inset -1px -1px @border_shade; }
|
|
.inline-toolbar button:active,
|
|
.primary-toolbar button:active,
|
|
toolbutton button:active,
|
|
.path-bar button:active
|
|
.inline-toolbar button:checked,
|
|
.primary-toolbar button:checked,
|
|
toolbutton button:checked,
|
|
.path-bar button:checked {
|
|
border-left: 1px solid @border_dark;
|
|
border-top: 1px solid @border_dark;
|
|
border-bottom: 1px solid @border_bright;
|
|
border-right: 1px solid @border_bright;
|
|
box-shadow: inset 1px 1px @border_shade; }
|
|
toolbutton .toggle:active,
|
|
toolbutton .toggle:checked,
|
|
.path-bar button:active,
|
|
.path-bar button:checked {
|
|
border-left: 1px solid @border_dark;
|
|
border-top: 1px solid @border_dark;
|
|
border-bottom: 1px solid @border_bright;
|
|
border-right: 1px solid @border_bright;
|
|
box-shadow: inset 1px 1px @border_shade;
|
|
background-color: @bg_bright;
|
|
background-image: linear-gradient(45deg, @bg_color 25%, transparent 25%, transparent 75%, @bg_color 75%, @bg_color), linear-gradient(45deg, @bg_color 25%, transparent 25%, transparent 75%, @bg_color 75%, @bg_dark);
|
|
background-size: 2px 2px;
|
|
background-position: 0 0, 1px 1px; }
|
|
toolbutton .toggle:active > label,
|
|
toolbutton .toggle:checked > label,
|
|
.path-bar button:active,
|
|
.path-bar button:checked {
|
|
text-shadow: 1px 1px @bg_color; } /* The text shadow helps with reading text while against a checkered background. */
|
|
toolbutton .toggle:checked:disabled {
|
|
box-shadow: inset 1px 1px @border_shade;
|
|
background-color: @bg_bright;
|
|
background-image: linear-gradient(45deg, @bg_color 25%, transparent 25%, transparent 75%, @bg_color 75%, @bg_color), linear-gradient(45deg, @bg_color 25%, transparent 25%, transparent 75%, @bg_color 75%, @bg_dark);
|
|
background-size: 2px 2px;
|
|
background-position: 0 0, 1px 1px; }
|
|
|
|
/* spinbuttons */
|
|
spinbutton:not(.vertical) {
|
|
border: 2px solid @border_dark;
|
|
border-image: url("assets/entry.png");
|
|
border-image-slice: 2 2 2 2;
|
|
border-radius: 0px;
|
|
box-shadow: none;
|
|
background-color: @bg_bright; }
|
|
spinbutton:not(.vertical) entry {
|
|
min-height: 16px;
|
|
border: none;
|
|
background: none;
|
|
background-color: @bg_bright;
|
|
border-radius: 0px;
|
|
box-shadow: none; }
|
|
spinbutton:not(.vertical) button {
|
|
min-height: 16px;
|
|
min-width: 16px;
|
|
padding: 0px;
|
|
border: 0px solid @border_dark;
|
|
background-color: transparent;
|
|
background-image: url("buttons/dialog_button_normal.png");
|
|
background-repeat: no-repeat;
|
|
background-position: 51% 50%;
|
|
border-radius: 0px;
|
|
box-shadow: none; }
|
|
spinbutton:not(.vertical) button:active {
|
|
min-height: 16px;
|
|
min-width: 16px;
|
|
padding: 0px;
|
|
border: 0px solid @border_dark;
|
|
background-color: transparent;
|
|
background-image: url("buttons/button_pressed.png");
|
|
background-repeat: no-repeat;
|
|
background-position: 51% 50%;
|
|
border-radius: 0px;
|
|
box-shadow: none;
|
|
border-radius: 0px; }
|
|
spinbutton.vertical entry {
|
|
min-width: 16px;
|
|
min-height: 16px;
|
|
padding: 0px;
|
|
margin-top: 2px;
|
|
margin-bottom: 2px; }
|
|
spinbutton.vertical button {
|
|
padding: 0px; }
|
|
|
|
/* destructive action buttons */
|
|
.destructive-action.button {
|
|
border-radius: 0px;
|
|
background-color: @error_color;
|
|
background-image: none;
|
|
color: mix(@theme_selected_fg_color, @error_color, 0.1); }
|
|
|
|
/* suggested action buttons */
|
|
.suggested-action.button {
|
|
color: @info_fg_color;
|
|
background-color: @info_bg_color; }
|
|
|
|
/* toolitem box button */
|
|
toolitem button {
|
|
background-color: @button_bg_color;
|
|
border-left: 1px solid @border_color;
|
|
border-right: 1px solid @border_dark;
|
|
border-bottom: 1px solid @border_dark;
|
|
border-top: 1px solid @border_color;
|
|
box-shadow: inset 1px 1px @border_bright, inset -1px -1px @border_shade; }
|
|
|
|
|
|
iconview {
|
|
-GdMainIconView-icon-size: 48; }
|
|
iconview:hover {
|
|
box-shadow: inset 1px 1px @border_color, inset -1px -1px @border_color; }
|
|
|
|
/* image buttons */
|
|
.image-button {
|
|
padding: 0px;
|
|
color: @text_color; }
|
|
.image-button label {
|
|
padding-left: 4px;
|
|
padding-right: 4px; }
|
|
|
|
/* statusbar buttons */
|
|
statusbar button {
|
|
border: 1px solid transparent;
|
|
box-shadow: none; }
|
|
statusbar button:active,
|
|
statusbar button:checked {
|
|
border: 1px dotted @outline_color;
|
|
box-shadow: none; }
|