kirbylife
/
numix-gtk-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fade-out Improvement

sass
Siddharth 2015-08-16 18:58:10 +05:30
parent 3467848945
commit 1a4cb9525e
18 changed files with 116 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
gtk-3.0/scss/_functions.scss
View File

@ -8,14 +8,6 @@ $modules: () !default;
} }
} }
@function alpha($color, $amount) {
@if type-of($color) == "color" {
@return fade-out($color, (1 - $amount));
} @else {
@return unquote("alpha(#{$color},#{$amount})");
}
}
@function shade($color, $amount) { @function shade($color, $amount) {
@if type-of($color) == "color" { @if type-of($color) == "color" {
@if ($amount > 1) { @if ($amount > 1) {

16
gtk-3.0/scss/apps/_gedit.scss
View File

@ -34,19 +34,19 @@
} }
.prelight-row .button { .prelight-row .button {
border-color: alpha($black, .1); border-color: fade-out($black, .9);
color: alpha($white, .8); color: fade-out($white, .2);
&:active { &:active {
border-color: alpha($black, .2); border-color: fade-out($black, .8);
background-color: alpha($black, .08); background-color: fade-out($black, .02);
color: $white; color: $white;
} }
} }
list-row, .prelight-row { list-row, .prelight-row {
.button:hover { .button:hover {
border-color: alpha($black, .1); border-color: fade-out($black, .9);
color: $white; color: $white;
} }
} }
@ -68,14 +68,14 @@
} }
.gedit-document-panel-dragged-row { .gedit-document-panel-dragged-row {
border: 1px solid alpha($black, .1); border: 1px solid fade-out($black, .9);
background-color: alpha($black, .5); background-color: fade-out($black, .5);
color: $white; color: $white;
} }
.gedit-document-panel-placeholder-row { .gedit-document-panel-placeholder-row {
border: 0; border: 0;
background-color: alpha($black, .08); background-color: fade-out($black, .02);
transition: all 200ms ease-in; transition: all 200ms ease-in;
} }

28
gtk-3.0/scss/apps/_lightdm.scss
View File

@ -8,8 +8,8 @@
background-image: none; background-image: none;
color: $white; color: $white;
font: bold; font: bold;
text-shadow: 0 1px alpha($black, .5); text-shadow: 0 1px fade-out($black, .5);
icon-shadow: 0 1px alpha($black, .5); icon-shadow: 0 1px fade-out($black, .5);
.menubar { .menubar {
&, > .menuitem { &, > .menuitem {
@ -17,19 +17,19 @@
background-image: none; background-image: none;
color: $white; color: $white;
font: bold; font: bold;
text-shadow: 0 1px alpha($black, .5); text-shadow: 0 1px fade-out($black, .5);
icon-shadow: 0 1px alpha($black, .5); icon-shadow: 0 1px fade-out($black, .5);
*:hover { color: $white; } *:hover { color: $white; }
&:hover { &:hover {
border-style: none; border-style: none;
background-color: alpha($white, .2); background-color: fade-out($white, .8);
background-image: none; background-image: none;
color: $white; color: $white;
} }
&:insensitive { color: alpha($white, .7); } &:insensitive { color: fade-out($white, .3); }
.menu { .menu {
border-radius: 1px; border-radius: 1px;
@ -111,10 +111,10 @@
&:focus, &:hover { &:focus, &:hover {
border-color: shade($lightdm_bg_color, .7); border-color: shade($lightdm_bg_color, .7);
box-shadow: inset 1px 0 alpha($dark_shadow, .1), box-shadow: inset 1px 0 fade-out($dark_shadow, .9),
inset 0 1px alpha($dark_shadow, .12), inset 0 1px fade-out($dark_shadow, .98),
inset -1px 0 alpha($dark_shadow, .1), inset -1px 0 fade-out($dark_shadow, .9),
inset 0 -1px alpha($dark_shadow, .05); inset 0 -1px fade-out($dark_shadow, .05);
} }
} }
} }
@ -143,10 +143,10 @@
border-radius: $roundness; border-radius: $roundness;
background-color: shade($lightdm_bg_color, .9); background-color: shade($lightdm_bg_color, .9);
background-image: none; background-image: none;
box-shadow: inset 1px 0 alpha($dark_shadow, .07), box-shadow: inset 1px 0 fade-out($dark_shadow, .03),
inset 0 1px alpha($dark_shadow, .08), inset 0 1px fade-out($dark_shadow, .02),
inset -1px 0 alpha($dark_shadow, .07), inset -1px 0 fade-out($dark_shadow, .03),
inset 0 -1px alpha($dark_shadow, .05); inset 0 -1px fade-out($dark_shadow, .05);
} }
#buttonbox_frame { #buttonbox_frame {

30
gtk-3.0/scss/apps/_unity-greeter.scss
View File

@ -7,8 +7,8 @@
.lightdm.menu { .lightdm.menu {
background-image: none; background-image: none;
background-color: alpha($black, 0.6); background-color: fade-out($black, 0.4);
border-color: alpha($white, 0.2); border-color: fade-out($white, 0.8);
border-radius: 4px; border-radius: 4px;
padding: 1px; padding: 1px;
@ -31,7 +31,7 @@
.lightdm.menubar { .lightdm.menubar {
background-image: none; background-image: none;
background-color: alpha(#00ff00, 0.5); background-color: fade-out(#00ff00, 0.5);
} }
@ -42,16 +42,16 @@
.lightdm.button{ .lightdm.button{
background-image: none; background-image: none;
background-color: alpha($black, 0.3); background-color: fade-out($black, 0.7);
border-color: alpha($white, 0.9); border-color: fade-out($white, 0.1);
border-radius: 5px; border-radius: 5px;
padding: 5px; padding: 5px;
color: $white; color: $white;
} }
.lightdm.button:hover { .lightdm.button:hover {
background-image: none; background-image: none;
background-color: alpha($white, 0.3); background-color: fade-out($white, 0.7);
border-color: alpha($white, 0.6); border-color: fade-out($white, 0.4);
border-radius: 5px; border-radius: 5px;
padding: 5px; padding: 5px;
color: $white; color: $white;
@ -63,8 +63,8 @@
.lightdm.entry { .lightdm.entry {
background-image: none; background-image: none;
background-color: alpha($black, 0.3); background-color: fade-out($black, 0.7);
border-color: alpha($white, 0.6); border-color: fade-out($white, 0.4);
border-radius: 5px; border-radius: 5px;
padding: 7px; padding: 7px;
color: $white; color: $white;
@ -77,13 +77,13 @@
border-image: none; border-image: none;
} }
.lightdm.entry:focused { .lightdm.entry:focused {
border-color: alpha($white, 0.6); border-color: fade-out($white, 0.4);
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
color: $white; color: $white;
} }
.lightdm.entry:selected { .lightdm.entry:selected {
background-color: alpha($white, 0.2); background-color: fade-out($white, 0.8);
} }
@keyframes dashentry_spinner { @keyframes dashentry_spinner {
@ -106,13 +106,13 @@
border-width: 0; border-width: 0;
} }
.lightdm.toggle-button.selected:hover { .lightdm.toggle-button.selected:hover {
background-color: alpha($white, 0.3); background-color: fade-out($white, 0.7);
border-color: alpha($white, 0.3); border-color: fade-out($white, 0.7);
border-width: 1px; border-width: 1px;
} }
.lightdm.toggle-button.selected { .lightdm.toggle-button.selected {
background-color: alpha($black, 0.3); background-color: fade-out($black, 0.7);
border-color: alpha($white, 0.3); border-color: fade-out($white, 0.7);
border-width: 1px; border-width: 1px;
} }
} }

4
gtk-3.0/scss/widgets/_base.scss
View File

@ -11,7 +11,7 @@
-GtkWindow-resize-grip-width: 0; -GtkWindow-resize-grip-width: 0;
-WnckTasklist-fade-overlay-rect: 0; -WnckTasklist-fade-overlay-rect: 0;
outline-color: alpha($selected_bg_color, .5); outline-color: fade-out($selected_bg_color, .5);
outline-style: dashed; outline-style: dashed;
outline-width: 1px; outline-width: 1px;
outline-offset: -1px; outline-offset: -1px;
@ -62,7 +62,7 @@
} }
.gtkstyle-fallback { .gtkstyle-fallback {
background-color: alpha($bg_color, .5); background-color: fade-out($bg_color, .5);
color: $fg_color; color: $fg_color;
&:prelight { &:prelight {

48
gtk-3.0/scss/widgets/_button.scss
View File

@ -79,11 +79,11 @@
@extend %linked_button; @extend %linked_button;
box-shadow: inset -1px 0 border_normal(rgba(0, 0, 0, .12 + $border_strength)), box-shadow: inset -1px 0 border_normal(rgba(0, 0, 0, .12 + $border_strength)),
0 1px 2px -1px alpha($dark_shadow, .12 + $shadow_strength); 0 1px 2px -1px fade-out($dark_shadow, .98 + $shadow_strength);
&:focus, &:hover { &:focus, &:hover {
box-shadow: inset -1px 0 border_focus(rgba(0, 0, 0, .12 + $border_strength)), box-shadow: inset -1px 0 border_focus(rgba(0, 0, 0, .12 + $border_strength)),
0 1px 2px -1px alpha($dark_shadow, .32 + $shadow_strength); 0 1px 2px -1px fade-out($dark_shadow, .78 + $shadow_strength);
} }
&:active, &:active:hover, &:active, &:active:hover,
@ -91,15 +91,15 @@
&:checked, &:checked:hover, &:checked, &:checked:hover,
&:checked:focus, &:checked:hover:focus { &:checked:focus, &:checked:hover:focus {
box-shadow: inset -1px 0 border_active(rgba(0, 0, 0, .12 + $border_strength)), box-shadow: inset -1px 0 border_active(rgba(0, 0, 0, .12 + $border_strength)),
inset 0 1px alpha($dark_shadow, .07), inset 0 1px fade-out($dark_shadow, .13),
inset 0 -1px alpha($dark_shadow, .05); inset 0 -1px fade-out($dark_shadow, .15);
} }
&:insensitive { box-shadow: inset -1px 0 shade($bg, .8); } &:insensitive { box-shadow: inset -1px 0 shade($bg, .8); }
&:last-child, &:only-child { box-shadow: 0 1px 2px -1px alpha($dark_shadow, .12 + $shadow_strength); } &:last-child, &:only-child { box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .98 + $shadow_strength); }
&:last-child:hover, &:only-child:hover { box-shadow: 0 1px 2px -1px alpha($dark_shadow, .32 + $shadow_strength); } &:last-child:hover, &:only-child:hover { box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .78 + $shadow_strength); }
&:insensitive:last-child, &:insensitive:only-child, &:insensitive:last-child, &:insensitive:only-child,
&:active:insensitive:last-child, &:active:insensitive:only-child, &:active:insensitive:last-child, &:active:insensitive:only-child,
@ -107,15 +107,15 @@
&:active:last-child, &:active:last-child:focus, &:active:last-child:hover, &:active:last-child:hover:focus, &:active:last-child, &:active:last-child:focus, &:active:last-child:hover, &:active:last-child:hover:focus,
&:checked:last-child, &:checked:last-child:focus, &:checked:last-child:hover, &:checked:last-child:hover:focus, { &:checked:last-child, &:checked:last-child:focus, &:checked:last-child:hover, &:checked:last-child:hover:focus, {
box-shadow: inset 0 1px alpha($dark_shadow, .07), box-shadow: inset 0 1px fade-out($dark_shadow, .13),
inset -1px 0 alpha($dark_shadow, .06); inset -1px 0 fade-out($dark_shadow, .14);
} }
&:active:only-child, &:active:only-child:focus, &:active:only-child:hover, &:active:only-child:hover:focus, &:active:only-child, &:active:only-child:focus, &:active:only-child:hover, &:active:only-child:hover:focus,
&:checked:only-child, &:checked:only-child:focus, &:checked:only-child:hover, &:checked:only-child:hover:focus { &:checked:only-child, &:checked:only-child:focus, &:checked:only-child:hover, &:checked:only-child:hover:focus {
box-shadow: inset 1px 0 alpha($dark_shadow, .06), box-shadow: inset 1px 0 fade-out($dark_shadow, .14),
inset 0 1px alpha($dark_shadow, .07), inset 0 1px fade-out($dark_shadow, .13),
inset -1px 0 alpha($dark_shadow, .06); inset -1px 0 fade-out($dark_shadow, .14);
} }
} }
@ -130,11 +130,11 @@
@include border(rgba(0, 0, 0, .12 + $border_strength)); @include border(rgba(0, 0, 0, .12 + $border_strength));
color: $fg; color: $fg;
box-shadow: 0 1px 2px -1px alpha($dark_shadow, .12 + $shadow_strength); box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .12 + $shadow_strength);
&.flat { &.flat {
border-color: alpha($button_bg, 0); border-color: fade-out($button_bg, 1);
background-color: alpha($button_bg, 0); background-color: fade-out($button_bg, 1);
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
} }
@ -144,17 +144,17 @@
@include linear-gradient(shade($button_bg, 1.2)); @include linear-gradient(shade($button_bg, 1.2));
@include border(rgba(0, 0, 0, .2 + $border_strength)); @include border(rgba(0, 0, 0, .2 + $border_strength));
box-shadow: 0 1px 2px -1px alpha($dark_shadow, .32 + $shadow_strength); box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .78 + $shadow_strength);
} }
&:active, &:checked { &:active, &:checked {
@include linear-gradient(shade($button_bg, .7), to top); @include linear-gradient(shade($button_bg, .7), to top);
color: $white; color: $white;
box-shadow: inset 1px 0 alpha($dark_shadow, .06), box-shadow: inset 1px 0 fade-out($dark_shadow, .14),
inset 0 1px alpha($dark_shadow, .07), inset 0 1px fade-out($dark_shadow, .13),
inset -1px 0 alpha($dark_shadow, .06), inset -1px 0 fade-out($dark_shadow, .14),
inset 0 -1px alpha($dark_shadow, .05); inset 0 -1px fade-out($dark_shadow, .15);
&:focus, &:hover { &:focus, &:hover {
@include linear-gradient(shade($button_bg, .65), to top); @include linear-gradient(shade($button_bg, .65), to top);
@ -176,7 +176,7 @@
@if (lightness($button_bg) > 50) { @if (lightness($button_bg) > 50) {
@include linear-gradient(shade($button_bg, .95)); @include linear-gradient(shade($button_bg, .95));
} @else { } @else {
@include linear-gradient(alpha($button_bg, .3)); @include linear-gradient(fade-out($button_bg, .7));
} }
color: mix($bg, $fg, .5); color: mix($bg, $fg, .5);
@ -212,15 +212,15 @@
box-shadow: none; box-shadow: none;
&:focus, &:hover { &:focus, &:hover {
border: 1px solid alpha($black, .3); border: 1px solid fade-out($black, .7);
background-color: alpha($white, .2); background-color: fade-out($white, .8);
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
} }
&:active, &:checked, &:active:hover, &:checked:hover { &:active, &:checked, &:active:hover, &:checked:hover {
border: 1px solid alpha($black, .3); border: 1px solid fade-out($black, .4);
background-color: alpha($black, .1); background-color: fade-out($black, .9);
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
} }

22
gtk-3.0/scss/widgets/_choosers.scss
View File

@ -5,12 +5,12 @@
@include exports("colorchooser") { @include exports("colorchooser") {
GtkColorSwatch { GtkColorSwatch {
&, &:selected { &, &:selected {
border: 1px solid alpha($black, .1); border: 1px solid fade-out($black, .9);
border-radius: $roundness - 1px; border-radius: $roundness - 1px;
background-color: transparent; background-color: transparent;
background-clip: border-box; background-clip: border-box;
&:hover { border-color: alpha($black, .3); } &:hover { border-color: fade-out($black, .7); }
} }
&.color-light:selected:hover, &.color-dark:selected:hover { background-image: none; } &.color-light:selected:hover, &.color-dark:selected:hover { background-image: none; }
@ -42,19 +42,19 @@
&.color-dark:hover, &.color-light:hover { &.color-dark:hover, &.color-light:hover {
background-image: none; background-image: none;
border-color: alpha($black, .3); border-color: fade-out($black, .7);
} }
} }
} }
GtkColorChooserWidget #add-color-button { GtkColorChooserWidget #add-color-button {
background-clip: padding-box; background-clip: padding-box;
border-color: alpha($black, .1); border-color: fade-out($black, .9);
background-color: shade($bg_color, .95); background-color: shade($bg_color, .95);
color: $fg_color; color: $fg_color;
&:hover { &:hover {
border-color: alpha($black, .3); border-color: fade-out($black, .7);
background-color: shade($bg_color, .9); background-color: shade($bg_color, .9);
color: $fg_color; color: $fg_color;
} }
@ -69,15 +69,15 @@
&.color-light { &.color-light {
&, &:hover { &, &:hover {
border-color: alpha($black, .3); border-color: fade-out($black, .7);
color: alpha($black, .3); color: fade-out($black, .7);
} }
} }
&.color-dark { &.color-dark {
&, &:hover { &, &:hover {
border-color: alpha($white, .3); border-color: fade-out($white, .7);
color: alpha($white, .3); color: fade-out($white, .7);
} }
} }
} }
@ -99,9 +99,9 @@
-GtkWidget-vertical-separator: 0; -GtkWidget-vertical-separator: 0;
} }
GtkLabel:last-child { color: alpha(currentColor, .7); } GtkLabel:last-child { color: fade-out(currentColor, .3); }
GtkImage:last-child { color: alpha(currentColor, .7); } GtkImage:last-child { color: fade-out(currentColor, .3); }
} }
GtkFileChooser { GtkFileChooser {

4
gtk-3.0/scss/widgets/_entry.scss
View File

@ -36,8 +36,8 @@
border-style: solid; border-style: solid;
border-radius: $roundness; border-radius: $roundness;
transition: border 150ms ease; transition: border 150ms ease;
box-shadow: inset 1px 1px alpha($dark_shadow, .06), box-shadow: inset 1px 1px fade-out($dark_shadow, .14),
inset -1px 0 alpha($dark_shadow, .06); inset -1px 0 fade-out($dark_shadow, .14);
&:focus, &:hover, &:active { transition: none; } &:focus, &:hover, &:active { transition: none; }

2
gtk-3.0/scss/widgets/_grid.scss
View File

@ -13,7 +13,7 @@
border-radius: 0; border-radius: 0;
padding: $spacing; padding: $spacing;
background-image: none; background-image: none;
background-color: alpha($bg_color, 0); background-color: fade-out($bg_color, 1);
box-shadow: none; box-shadow: none;
&:hover { &:hover {

12
gtk-3.0/scss/widgets/_menu.scss
View File

@ -144,11 +144,11 @@
} }
.accelerator { .accelerator {
color: alpha($menu_fg_color, .6); color: fade-out($menu_fg_color, .4);
&:hover { color: alpha($selected_fg_color, .8); } &:hover { color: fade-out($selected_fg_color, .2); }
&:insensitive { color: alpha(mix($menu_fg_color, $menu_bg_color, .5), .4); } &:insensitive { color: fade-out(mix($menu_fg_color, $menu_bg_color, .5), .6); }
} }
.entry { @include entry($menu_bg_color, $menu_fg_color); } .entry { @include entry($menu_bg_color, $menu_fg_color); }
@ -175,7 +175,7 @@
background-color: $menu_bg_color; background-color: $menu_bg_color;
background-image: none; background-image: none;
color: $menu_fg_color; color: $menu_fg_color;
box-shadow: 0 3px 6px alpha($black, .16); box-shadow: 0 3px 6px fade-out($black, .04);
&.background { &.background {
background-image: none; background-image: none;
@ -186,7 +186,7 @@
&:backdrop { box-shadow: none; } &:backdrop { box-shadow: none; }
&.osd { &.osd {
box-shadow: 0 2px 7px 3px alpha($black, .5); box-shadow: 0 2px 7px 3px fade-out($black, .5);
> .toolbar .button { > .toolbar .button {
border-radius: 0; border-radius: 0;
@ -230,7 +230,7 @@
.separator { .separator {
border: 0; border: 0;
background-color: transparent; background-color: transparent;
color: alpha($menu_bg_color, .5); color: fade-out($menu_bg_color, .5);
font-size: 80%; font-size: 80%;
font-weight: bold; font-weight: bold;
} }

16
gtk-3.0/scss/widgets/_misc.scss
View File

@ -81,17 +81,17 @@
} }
.expander { .expander {
color: alpha(currentColor, .7); color: fade-out(currentColor, .3);
border: alpha(currentColor, .7); border: fade-out(currentColor, .3);
&:hover { &:hover {
color: alpha(currentColor, .8); color: fade-out(currentColor, .2);
border-color: alpha(currentColor, .8); border-color: fade-out(currentColor, .2);
} }
&:active { &:active {
color: alpha(currentColor, .9); color: fade-out(currentColor, .1);
border-color: alpha(currentColor, .9); border-color: fade-out(currentColor, .1);
} }
} }
} }
@ -103,9 +103,9 @@
@include exports("symbolicimage") { @include exports("symbolicimage") {
.image { .image {
color: alpha(currentColor, .5); color: fade-out(currentColor, .5);
&:hover { color: alpha(currentColor, .9); } &:hover { color: fade-out(currentColor, .1); }
&:selected, &:selected:hover { color: $selected_fg_color; } &:selected, &:selected:hover { color: $selected_fg_color; }
} }

4
gtk-3.0/scss/widgets/_notebook.scss
View File

@ -110,7 +110,7 @@
border-left: 0; border-left: 0;
border-right: 0; border-right: 0;
/* using box shadows instead of borders due to slanted edges */ /* using box shadows instead of borders due to slanted edges */
box-shadow: inset 0 3px alpha($black, .03), inset 0 2px alpha($black, .03), inset 0 1px alpha($black, .03), box-shadow: inset 0 3px fade-out($black, .17), inset 0 2px fade-out($black, .17), inset 0 1px fade-out($black, .17),
inset 1px 0 shade($base_color, .7), inset -1px 0 shade($base_color, .7); inset 1px 0 shade($base_color, .7), inset -1px 0 shade($base_color, .7);
} }
@ -118,7 +118,7 @@
background-color: shade($base_color, .9); background-color: shade($base_color, .9);
border-left: 0; border-left: 0;
border-right: 0; border-right: 0;
box-shadow: inset 0 3px alpha($black, .03), inset 0 2px alpha($black, .03), inset 0 1px alpha($black, .03), box-shadow: inset 0 3px fade-out($black, .17), inset 0 2px fade-out($black, .17), inset 0 1px fade-out($black, .17),
inset 1px 0 shade($base_color, .75), inset -1px 0 shade($base_color, .75); inset 1px 0 shade($base_color, .75), inset -1px 0 shade($base_color, .75);
} }
} }

2
gtk-3.0/scss/widgets/_osd.scss
View File

@ -10,7 +10,7 @@
.osd { .osd {
&.background { &.background {
background-color: alpha($osd_bg, .8); background-color: fade-out($osd_bg, .2);
color: $osd_fg; color: $osd_fg;
} }

12
gtk-3.0/scss/widgets/_overshoot.scss
View File

@ -25,14 +25,14 @@
$_small_gradient: -gtk-gradient(radial, $_small_gradient: -gtk-gradient(radial,
$_position, 0, $_position, 0,
$_position, .5, $_position, .5,
to(alpha($_small_gradient_color, .35)), to(fade-out($_small_gradient_color, .75)),
to(alpha($_small_gradient_color, .25))); to(fade-out($_small_gradient_color, .85)));
$_big_gradient: -gtk-gradient(radial, $_big_gradient: -gtk-gradient(radial,
$_position, 0, $_position, 0,
$_position, .6, $_position, .6,
from(alpha($_big_gradient_color, .2)), from(fade-out($_big_gradient_color, .8)),
to(alpha($_big_gradient_color, 0))); to(fade-out($_big_gradient_color, 1)));
@if $type == normal { @if $type == normal {
background-image: $_small_gradient, $_big_gradient; background-image: $_small_gradient, $_big_gradient;
@ -51,8 +51,8 @@
} }
@mixin undershoot($position) { @mixin undershoot($position) {
$_undershoot_color_dark: alpha($black, .2); $_undershoot_color_dark: fade-out($black, .8);
$_undershoot_color_light: alpha($white, .2); $_undershoot_color_light: fade-out($white, .8);
$_gradient_dir: left; $_gradient_dir: left;
$_dash_bg_size: 10px 1px; $_dash_bg_size: 10px 1px;

12
gtk-3.0/scss/widgets/_progress.scss
View File

@ -7,7 +7,7 @@
padding: 0; padding: 0;
border-radius: $roundness; border-radius: $roundness;
font-size: smaller; font-size: smaller;
color: alpha($fg_color, .6); color: fade-out($fg_color, .4);
-GtkProgressBar-min-horizontal-bar-height: 6; -GtkProgressBar-min-horizontal-bar-height: 6;
-GtkProgressBar-min-vertical-bar-width: 6; -GtkProgressBar-min-vertical-bar-width: 6;
@ -19,7 +19,7 @@
} }
&.trough { &.trough {
border: 1px solid alpha(border_normal($bg_color), .5); border: 1px solid fade-out(border_normal($bg_color), .5);
background-color: shade($bg_color, 1.08); background-color: shade($bg_color, 1.08);
background-image: none; background-image: none;
} }
@ -72,7 +72,7 @@
&.trough { &.trough {
@include linear-gradient(shade($bg_color, 1.08), to top); @include linear-gradient(shade($bg_color, 1.08), to top);
border: 1px solid alpha(border_normal($bg_color), .5); border: 1px solid fade-out(border_normal($bg_color), .5);
border-radius: $roundness; border-radius: $roundness;
} }
@ -126,7 +126,7 @@
border-radius: 8px; border-radius: 8px;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
box-shadow: 0 1px 2px -1px alpha($dark_shadow, .3); box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .7);
&:insensitive { @include linear-gradient(shade($bg_color, .9)); } &:insensitive { @include linear-gradient(shade($bg_color, .9)); }
} }
@ -141,14 +141,14 @@
} }
} }
&.mark { border-color: alpha(border_normal($bg_color), .5); } &.mark { border-color: fade-out(border_normal($bg_color), .5); }
&.trough { &.trough {
@include linear-gradient(shade($bg_color, 1.08)); @include linear-gradient(shade($bg_color, 1.08));
margin: 7px 0; margin: 7px 0;
border: 1px solid alpha(border_normal($bg_color), .5); border: 1px solid fade-out(border_normal($bg_color), .5);
border-radius: $roundness; border-radius: $roundness;
&:insensitive { @include linear-gradient(shade($bg_color, .9)); } &:insensitive { @include linear-gradient(shade($bg_color, .9)); }

2
gtk-3.0/scss/widgets/_scrollbar.scss
View File

@ -25,7 +25,7 @@
border-radius: 0; border-radius: 0;
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
color: alpha($fg_color, .5); color: fade-out($fg_color, .5);
} }
} }

10
gtk-3.0/scss/widgets/_toggle.scss
View File

@ -79,7 +79,7 @@ $suffix: if($variant == "dark", "-dark", "");
@include linear-gradient(shade($bg_color, 1.2)); @include linear-gradient(shade($bg_color, 1.2));
border: 1px solid rgba(0, 0, 0, .2); border: 1px solid rgba(0, 0, 0, .2);
box-shadow: 0 1px 2px -1px alpha($dark_shadow, .12); box-shadow: 0 1px 2px -1px fade-out($dark_shadow, .08);
&:insensitive { &:insensitive {
border-color: rgba(0, 0, 0, .1); border-color: rgba(0, 0, 0, .1);
@ -93,10 +93,10 @@ $suffix: if($variant == "dark", "-dark", "");
border: 1px solid border_normal($bg_color); border: 1px solid border_normal($bg_color);
color: $fg_color; color: $fg_color;
box-shadow: inset 1px 0 alpha($dark_shadow, .07), box-shadow: inset 1px 0 fade-out($dark_shadow, .13),
inset 0 1px alpha($dark_shadow, .08), inset 0 1px fade-out($dark_shadow, .12),
inset -1px 0 alpha($dark_shadow, .07), inset -1px 0 fade-out($dark_shadow, .13),
inset 0 -1px alpha($dark_shadow, .05); inset 0 -1px fade-out($dark_shadow, .15);
&:active { &:active {
@include linear-gradient($selected_bg_color, to top); @include linear-gradient($selected_bg_color, to top);

8
gtk-3.0/scss/widgets/_view.scss
View File

@ -45,7 +45,7 @@
&.view { &.view {
background-color: $base_color; background-color: $base_color;
&:prelight { background-color: alpha($selected_bg_color, .6); } &:prelight { background-color: fade-out($selected_bg_color, .4); }
&:selected, &:active { background-color: $selected_bg_color; } &:selected, &:active { background-color: $selected_bg_color; }
@ -77,20 +77,20 @@
} }
.dim-label { .dim-label {
&, &.view { color: alpha(currentColor, .5); } &, &.view { color: fade-out(currentColor, .5); }
} }
.dnd { border: 1px solid $selected_bg_color; } .dnd { border: 1px solid $selected_bg_color; }
.grip { background-color: transparent; } .grip { background-color: transparent; }
.arrow { color: alpha(currentColor, .7); } .arrow { color: fade-out(currentColor, .3); }
.rubberband { .rubberband {
&, &.view, &.content-view.view { &, &.view, &.content-view.view {
border: 1px solid $selected_bg_color; border: 1px solid $selected_bg_color;
border-radius: 0; border-radius: 0;
background-color: alpha($selected_bg_color, .3); background-color: fade-out($selected_bg_color, .7);
} }
} }