numix-gtk-theme/gtk-3.0/scss/widgets.scss

246 lines
6.4 KiB
SCSS
Executable File

@import "functions";
@import "colors";
@import "base";
@import "button";
@import "entry";
@import "calendar";
@import "choosers";
@import "grid";
@import "infobar";
@import "menu";
@import "misc";
@import "notebook";
@import "osd";
@import "progress";
@import "scrollbar";
@import "sidebar";
@import "spinner";
@import "toggle";
@import "toolbar";
@import "view";
@import "window";
/**************
* action-bar *
**************/
.action-bar {
padding: 4px;
border-width: 1px 0 0 0;
border-style: solid;
border-color: shade($bg_color, 0.8);
background-color: $bg_color;
background-image: none;
color: $fg_color;
}
.action-bar .button.text-button {
padding: 4px;
}
.action-bar .button.image-button {
padding: 6px;
}
.action-bar .title {
font: bold;
padding: 0 12px;
}
.action-bar .subtitle {
font: smaller;
padding: 0 12px;
}
/***************
* search bars *
***************/
.search-bar {
border-width: 0 0 1px 0;
border-style: solid;
border-color: shade($bg_color, 0.8);
background-color: shade($bg_color, 0.98);
}
.search-bar .button.close-button {
padding: 4px;
}
/******************************
* destructive action buttons *
******************************/
.destructive-action.button {
border-width: 1px;
border-style: solid;
border-color: shade($error_color, 0.8);
border-radius: 2px;
background-color: $error_color;
background-image: none;
color: mix($selected_fg_color, $error_color, 0.1);
}
.destructive-action.button:hover {
border-color: shade($error_color, 0.7);
background-color: shade($error_color, 1.12);
background-image: none;
}
.destructive-action.button:active {
border-color: shade($error_color, 0.8);
background-color: shade($error_color, 0.87);
background-image: none;
}
.destructive-action.button:hover:active {
border-color: shade($error_color, 0.7);
}
/******************************
* suggested action buttons *
******************************/
.suggested-action.button {
border-width: 1px;
border-style: solid;
border-color: shade($selected_bg_color, 0.9);
border-radius: 2px;
background-color: shade($selected_bg_color, 1.18);
background-image: none;
color: mix($selected_fg_color, $selected_bg_color, 0.1);
}
.suggested-action.button:hover {
border-color: shade($selected_bg_color, 0.8);
background-color: shade($selected_bg_color, 1.20);
background-image: none;
}
.suggested-action.button:active {
border-color: shade($selected_bg_color, 0.9);
background-color: shade($selected_bg_color, 1.05);
background-image: none;
}
.suggested-action.button:hover:active {
border-color: shade($selected_bg_color, 0.8);
}
/******************
* selection mode *
******************/
.selection-mode.header-bar,
.selection-mode.toolbar {
border-style: solid;
border-color: $selected_bg_color;
background-color: shade($selected_bg_color, 1.6);
background-image: none;
color: $selected_bg_color;
}
.selection-mode.header-bar {
border-top-color: shade($selected_bg_color, 1.6);
border-bottom-color: $selected_bg_color;
}
.selection-mode.toolbar {
padding: 4px;
}
/* regular button */
.selection-mode.header-bar .button,
.selection-mode.toolbar .button,
.selection-mode.toolbar GtkToolButton .button {
border-width: 1px;
border-style: solid;
border-color: $selected_bg_color;
border-radius: 2px;
background-color: shade($selected_bg_color, 1.68);
background-image: none;
color: shade($selected_bg_color, 0.8);
}
.selection-mode.header-bar .button:hover,
.selection-mode.toolbar .button:hover,
.selection-mode.toolbar GtkToolButton .button:hover {
border-color: shade($selected_bg_color, 0.9);
background-color: shade($selected_bg_color, 1.70);
background-image: none;
}
.selection-mode.header-bar .button:active,
.selection-mode.toolbar .button:active,
.selection-mode.toolbar GtkToolButton .button:active {
border-color: shade($selected_bg_color, 0.9);
background-color: shade($selected_bg_color, 1.55);
background-image: none;
}
.selection-mode.header-bar .button:hover:active,
.selection-mode.toolbar .button:hover:active,
.selection-mode.toolbar GtkToolButton .button:hover:active {
border-color: shade($selected_bg_color, 0.8);
}
/* suggested button */
.selection-mode.header-bar .suggested-action.button,
.selection-mode.toolbar .suggested-action.button,
.selection-mode.toolbar GtkToolButton.suggested-action .button {
border-width: 1px;
border-style: solid;
border-color: shade($selected_bg_color, 0.9);
border-radius: 2px;
background-color: shade($selected_bg_color, 1.18);
background-image: none;
color: mix($selected_fg_color, $selected_bg_color, 0.1);
}
.selection-mode.header-bar .suggested-action.button:hover,
.selection-mode.toolbar .suggested-action.button:hover,
.selection-mode.toolbar GtkToolButton.suggested-action .button:hover {
border-color: shade($selected_bg_color, 0.8);
background-color: shade($selected_bg_color, 1.20);
background-image: none;
}
.selection-mode.header-bar .suggested-action.button:active,
.selection-mode.toolbar .suggested-action.button:active,
.selection-mode.toolbar GtkToolButton.suggested-action:active {
border-color: shade($selected_bg_color, 0.9);
background-color: shade($selected_bg_color, 1.05);
background-image: none;
}
.selection-mode.header-bar .suggested-action.button:hover:active,
.selection-mode.toolbar .suggested-action.button:hover:active,
.selection-mode.toolbar GtkToolButton.suggested-action .button:hover:active {
border-color: shade($selected_bg_color, 0.8);
}
/* menu button */
.selection-mode.header-bar .selection-menu.button,
.selection-mode.toolbar .selection-menu.button {
border-style: none;
background-color: transparent;
background-image: none;
color: shade($selected_bg_color, 0.8);
}
.selection-mode.toolbar .dim-label,
.selection-mode.toolbar .selection-menu.button .dim-label {
color: shade($selected_bg_color, 0.7);
}
.selection-mode.header-bar .selection-menu.button:hover,
.selection-mode.toolbar .dim-label:hover,
.selection-mode.toolbar .selection-menu.button:hover,
.selection-mode.toolbar .selection-menu.button .dim-label:hover {
color: shade($selected_bg_color, 0.7);
}
.selection-mode.header-bar .selection-menu.button:active,
.selection-mode.toolbar .selection-menu.button:active {
color: shade($selected_bg_color, 0.8);
box-shadow: none;
}