Compilation of problems in sassy parallax banner

Projects
1

I’ve read through the other topics to see what sort of problems other people are encountering and i seem to be coming across all of them with mine.

My scss isn’t compiling to to css, so nothing is occurring in the browser. I’m getting small error messages even though i have followed the hints to the letter.

Im using chrome by the way if that helps.

Things like “unknown rule, @mixin” and “unexpected token” on the variables.

Please help, im very stuck.

Thank you!
Ben

2

Solved by a lovely code academy helper.

3

Would you mind sharing the fix?

4

(apologies if this is too revealing)

i needed to include the backround size mixin with the parrallax background mixin and ensure my variables were expressed correctly.

$parallax-height: 100vh;
$center-margin: 0px auto;

@mixin parallax-background($file) {
background: url($file) no-repeat center center fixed;
@include background-size(cover);
}

@mixin background-size($size) {
-webkit-background-size: $size;
-moz-background-size: $size;
-o-background-size: $size;
background-size: $size;
}

html, body {
margin: 0;
padding: 0;
font-family: Roboto;
color: #2e3738;
}

#landscape {
width: 100%;
height: $parallax-height;
perspective: 1px;
transform: translateZ(-1px);
overflow-x: hidden;
overflow-y: auto;
@include parallax-background(“https://s3.amazonaws.com/codecademy-content/projects/sass/landscape.jpg”);
}

#monkeys {
width: 100%;
height: $parallax-height;
perspective: 1px;
transform: translateZ(-1px);
overflow-x: hidden;
overflow-y: auto;
@include parallax-background(“https://s3.amazonaws.com/codecademy-content/projects/sass/monkeys.jpg”);
}

#landscape,
#monkeys {

}

h1{
	text-transform: uppercase;
  	font-family: 'Bitter', serif;
  	letter-spacing: 0.06em;
  	font-size: 120px;
  	color: #FFF;
  	opacity: 0.7;
  	text-align: center;
transform: translateZ(-2px);
}

p {
width: 70%;
padding: 5%;
margin: $center-margin;
text-align: center;
font-size: 20px;
font-weight: 200;
line-height: 1.4;
}

5

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.