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

@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 "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;
}

/*******
* osd *
*******/
//.background.osd {
//    color: $osd_fg;
//    background-color: $osd_bg;
//}
//
//GtkOverlay.osd {
//    background-color: transparent;
//}
//
//.osd.frame {
//    background-clip: border-box;
//    background-origin: border-box;
//}
//
//.osd.button,
//.osd .button {
//    padding: 4px;
//    border-width: 1px;
//    border-style: solid;
//    border-color: shade($osd_bg, 0.8);
//    border-radius: 2px;
//    background-color: shade($osd_bg, 1.08);
//    background-image: none;
//    color: $osd_fg;
//}
//
//.osd.button:prelight,
//.osd.button:hover,
//.osd .button:hover {
//    border-color: shade($osd_bg, 0.7);
//    background-color: shade($osd_bg, 1.10);
//    background-image: none;
//}
//
//.osd.button:active,
//.osd .button:active,
//.osd GtkMenuButton.button:active {
//    border-color: shade($osd_bg, 0.8);
//    background-color: shade($osd_bg, 0.95);
//    background-image: none;
//}
//
//.osd.button:active:hover,
//.osd .button:active:hover,
//.osd GtkMenuButton.button:active:hover {
//    border-color: shade($osd_bg, 0.7);
//}
//
//.osd.button:insensitive,
//.osd .button:insensitive {
//    border-color: shade($osd_bg, 0.85);
//    background-color: shade($osd_bg, 0.9);
//    background-image: none;
//}
//
//.osd.button:active *:insensitive,
//.osd .button:active *:insensitive {
//    background-color: shade($osd_bg, 0.80);
//    background-image: none;
//}
//
//.osd.toolbar {
//    -GtkToolbar-button-relief: normal;
//
//    padding: 4px;
//    border-width: 1px;
//    border-style: solid;
//    border-radius: 2px;
//    border-color: shade($osd_bg, 0.8);
//    background-color: $osd_bg;
//    background-image: none;
//    color: $osd_fg;
//}
//
//.osd.toolbar .button {
//    padding: 4px;
//    border-width: 1px;
//    border-style: solid;
//    border-color: shade($osd_bg, 0.8);
//    border-radius: 2px;
//    background-color: shade($osd_bg, 1.08);
//    background-image: none;
//    color: $osd_fg;
//}
//
//.osd.toolbar .button:hover {
//    border-color: shade($osd_bg, 0.7);
//    background-color: shade($osd_bg, 1.10);
//    background-image: none;
//}
//
//.osd.toolbar .button:active {
//    border-color: shade($osd_bg, 0.8);
//    background-color: shade($osd_bg, 0.95);
//    background-image: none;
//}
//
//.osd.toolbar .button:active:hover {
//    border-color: shade($osd_bg, 0.7);
//}
//
//.osd.toolbar .button:focus,
//.osd.toolbar .button:hover:focus,
//.osd.toolbar .button:active:focus,
//.osd.toolbar .button:active:hover:focus {
//    border-color: shade($osd_bg, 0.7);
//}
//
//.osd.toolbar .button:insensitive {
//    border-color: shade($osd_bg, 0.85);
//    background-color: shade($osd_bg, 0.9);
//    background-image: none;
//}
//
//.osd.toolbar .button:active *:insensitive {
//    border-color: shade($osd_bg, 0.75);
//    background-color: shade($osd_bg, 0.80);
//    background-image: none;
//}
//
//.osd.toolbar .button:first-child {
//    border-radius: 2px 0 0 2px;
//    border-width: 1px 0 1px 1px;
//    box-shadow: inset -1px 0 shade($osd_bg, 0.9);
//}
//
//.osd.toolbar .button:last-child {
//    box-shadow: none;
//    border-radius: 0 2px 2px 0;
//    border-width: 1px 1px 1px 0;
//}
//
//.osd.toolbar .button:only-child,
//.osd.toolbar GtkToolButton .button,
//.osd.toolbar GtkToolButton:only-child .button,
//.osd.toolbar GtkToolButton:last-child .button,
//.osd.toolbar GtkToolButton:first-child .button {
//    border-width: 1px;
//    border-radius: 2px;
//    border-style: solid;
//}
//
//.osd.toolbar .separator {
//    color: shade($osd_bg, 0.9);
//}
//
///* used by gnome-settings-daemon's media-keys OSD */
//.osd.trough {
//    background-color: shade($osd_bg, 0.8);
//}
//
//.osd.progressbar {
//    background-color: $osd_fg;
//}
//
//.osd .scale.slider {
//    background-color: shade($osd_bg, 1.08);
//    background-image: none;
//    /* we will draw the border using box shadow for now */
//    box-shadow: inset 1px 0 shade($osd_bg, 0.8),
//        inset 0 1px shade($osd_bg, 0.8),
//        inset -1px 0 shade($osd_bg, 0.8),
//        inset 0 -1px shade($osd_bg, 0.8);
//}
//
//.osd .scale.slider:hover {
//    box-shadow: inset 1px 0 shade($osd_bg, 0.7),
//        inset 0 1px shade($osd_bg, 0.7),
//        inset -1px 0 shade($osd_bg, 0.7),
//        inset 0 -1px shade($osd_bg, 0.7);
//}
//
//.osd .scale.slider:insensitive {
//    background-color: shade($osd_bg, 0.9);
//    background-image: none;
//    box-shadow: inset 1px 0 shade($osd_bg, 0.85),
//        inset 0 1px shade($osd_bg, 0.85),
//        inset -1px 0 shade($osd_bg, 0.85),
//        inset 0 -1px shade($osd_bg, 0.85);
//}
//
//.osd .scale.trough {
//    border-color: shade($osd_bg, 0.8);
//    background-color: shade($osd_bg, 1.08);
//    background-image: none;
//}
//
//.osd .scale.trough.highlight {
//    border-color: $selected_bg_color;
//    background-color: $selected_bg_color;
//    background-image: none;
//}
//
//.osd .scale.trough:insensitive,
//.osd .scale.trough.highlight:insensitive {
//    border-color: shade($osd_bg, 0.85);
//    background-color: shade($osd_bg, 0.9);
//    background-image: none;
//}
//
//.osd GtkProgressBar,
//GtkProgressBar.osd {
//    -GtkProgressBar-xspacing: 0;
//    -GtkProgressBar-yspacing: 2px;
//    -GtkProgressBar-min-horizontal-bar-height: 2px;
//
//    padding: 0;
//}
//
//.osd GtkProgressBar.trough,
//GtkProgressBar.osd.trough {
//    padding: 0;
//    border-style: none;
//    border-radius: 0;
//    background-image: none;
//    background-color: transparent;
//}
//
//.osd GtkProgressBar.progressbar,
//GtkProgressBar.osd.progressbar {
//    border-style: none;
//    border-radius: 0;
//    background-color: $selected_bg_color;
//    background-image: none;
//}
//
//.osd .view,
//.osd.view {
//    background-color: $osd_base;
//}
//
//.osd .scrollbar.trough {
//    background-color: $osd_bg;
//}
//
//.osd .scrollbar.slider {
//    border-width: 1px;
//    border-color: mix(shade($osd_base, 0.87), $osd_fg, 0.21);
//    border-radius: 0;
//    background-color: mix($osd_base, $osd_fg, 0.21);
//}
//
//.osd .scrollbar.slider:hover {
//    border-color: mix(shade($osd_base, 0.87), $osd_fg, 0.31);
//    background-color: mix($osd_base, $osd_fg, 0.31);
//}
//
//.osd .scrollbar.slider:active {
//    border-color: shade($selected_bg_color, 0.9);
//    background-color: $selected_bg_color;
//}
//
//.osd GtkIconView.cell:selected,
//.osd GtkIconView.cell:selected:focus {
//    background-color: transparent;
//    border-style: solid;
//    border-radius: 2px;
//    border-width: 3px;
//    border-color: $osd_fg;
//    outline-color: transparent;
//}
//
///* used by Documents */
//.osd .page-thumbnail {
//    border-style: solid;
//    border-width: 1px;
//    border-color: shade($osd_bg, 0.9);
//    /* when there's no pixbuf yet */
//    background-color: $osd_bg;
//}

/******************************
* 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;
}