Logo mixin to include fallback SVG

svg-logo.scss

// Im not really sure what your intention is for this mixin.
// Originally it looked like you were including this mixin  to a parent class, 
// that would then create the .logo styles along with .svg & .no-svg fallback classes.
// This example includes the mixin to .logo since we know its going to exist anyhow.
// Dont know if it actuualy helps you, I'd need more info.

@mixin svg-logo($img-name) {

	// Compass cant get an image width/height from just a name, its needs an actual image,
	// which wouldnt work in this case.
	// height:image-height($img)
	// width:image-width($img);

	.svg & {
		background: image-url("logo/#{$img-name}.svg") no-repeat;
	}

	.no-svg & {
		background: image-url("logo/#{$img-name}.png") no-repeat;
	}
}

.logo {
	@include svg-logo('test');
	display:block;;
	height: 100px;
	overflow:hidden;
	text-indent:-9999em;
	width: 100px;
}

// outputs
//.svg .logo {
//  background: url('../img/logo/test.svg') no-repeat;
//}
//.no-svg .logo {
//  background: url('../img/logo/test.png') no-repeat;
//}