Contents

@mixin alert-style($bg, $text) {
	color: $text;
	background: $bg;
	border: 1px solid shade($bg, 10%);

	hr { border-color: shade($bg, 10%); }

	a { color: shade($text, 10%); }
	a:hover { color: tint($text, 25%); }

	@content;
}

@mixin button-style($base, $light, $dark) {
	font-weight: bold;
	background: shade($base, 5%);
	text-shadow: 1px 1px black(.2);
	border: 1px solid shade($base, 12%);

	@include active-state {
		color: #fff;
		background-color: shade($base, 20%);
		text-shadow: 1px 1px $dark;
		border-color: shade($base, 30%);
	}

	@include disabled-state {
		background: $base;
		border-color: $base;
		box-shadow: none;
		text-shadow: none;
		top: 0;
		opacity: $disabled-opacity;
	}

	@content;
}

@mixin label-style($bg, $text) {
	background: $bg;
	color: $text;

	@content;
}

@mixin progress-style($bg, $border) {
	background: $bg;
	text-shadow: 1px 1px $border;
	border: 1px solid tint($border, 35%);
	border-right: 0;

	@content;
}

@mixin field-style() {
	&.has-error {
		.input,
		.select {
			border-color: $error;

			&:focus { box-shadow: 0 0 5px $error-light; }
		}

		.radio,
		.checkbox {
			color: $error-dark;
		}
	}

	&.has-warning {
		.input,
		.select {
			border-color: $warning;

			&:focus { box-shadow: 0 0 5px $warning-light; }
		}

		.radio,
		.checkbox {
			color: $warning-dark;
		}
	}

	&.has-success {
		.input,
		.select {
			border-color: $success;

			&:focus { box-shadow: 0 0 5px $success-light; }
		}

		.radio,
		.checkbox {
			color: $success-dark;
		}
	}
}

Version data entries

3 entries across 3 versions & 1 rubygems

Version	Path
titon-toolkit-0.9.4	src/scss/toolkit/mixins/_themes.scss
titon-toolkit-0.9.3	src/scss/toolkit/mixins/_themes.scss
titon-toolkit-0.9.2	src/scss/toolkit/mixins/_themes.scss