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

@import "functions";
@import "global";


/***********************
 ! Check and Radio items
************************/

* {
	-GtkCheckButton-indicator-size: 16;
	-GtkCheckMenuItem-indicator-size: 14;
}

@mixin toggle($type, $bg, $fg) {
	color: $fg;
	background-image: none;
	-gtk-icon-source: -gtk-icontheme('#{$type}-symbolic');

	&:checked, &:active {
	    -gtk-icon-source: -gtk-icontheme('#{$type}-checked-symbolic');
	}

	&:inconsistent {
	    -gtk-icon-source: -gtk-icontheme('#{$type}-mixed-symbolic');
	}

	&:focus, &:hover {
	    color: shade($fg, 1.2);
	}

	&:active {
	    color: shade($fg, 0.8);
	}

	&:insensitive {
	    color: mix($bg, $fg, .5);
	}

	&:active *:insensitive {
	    color: mix($bg, $fg, .8);
	}

}

.radio { @include toggle("radio", $bg_color, $fg_color); }

.check { @include toggle("checkbox", $bg_color, $fg_color); }


/********
 ! Switch
*********/

GtkSwitch {
	padding: 0;
	border-radius: $roundness;
	font: bold condensed;
	outline-offset: -4px;

	&.slider {
		border: 1px solid shade($bg_color, 0.8);
		background-color: shade($bg_color, 1.08);

		&:insensitive {
			border-color: shade($bg_color, 0.85);
			background-color: shade($bg_color, 0.9);
		}
	}

	&.trough {
		border-color: shade($bg_color, 0.8);
		background-color: shade($bg_color, 0.95);
		color: $fg_color;

		&:active {
			border-color: shade($selected_bg_color, 0.9);
			background-color: $selected_bg_color;
			color: $selected_fg_color;
		}

		&:insensitive {
			border-color: shade($bg_color, 0.85);
			background-color: shade($bg_color, 0.9);
			color: mix($fg_color, $bg_color, 0.5);
		}
	}
}