SASS Invalid CSS error on Rails

Question

I'm trying to use http://startbootstrap.com/stylish-portfolio in my rails app however I'm getting the following error in my stylish-portfolio.css.scss.erb file:

ActionView::Template::Error (Invalid CSS after "body ": expected selector or at-rule, was "{"

This is my css file:

@import 'bootstrap'

/* Global Styles */

html,
body {
  height: 100%;
  width: 100%;
}

.vert-text {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.vert-text h1 {
  padding: 0;
  margin: 0;
  font-size: 4.5em;
  font-weight: 700;
}

...

Solution

My guess is that you are missing a semicolon in the stylish-portfolio.css.scss.erb file, maybe after an SCSS variable definition?

Here's the original CSS file I assume you are basing this on, maybe you want to do a diff between that and yours to determine what has changed.

---

Edit: Yup, apparently there is a missing semicolon after the first line. The @import statement

@import 'bootstrap'

should instead be

@import 'bootstrap';

since you are using the .scss extension. You can omit the semi-colon if you are using the .sass extension.

Comments

[Leo Costa]

Stupid mistake, posted the wrong file here. Actually I was missing a semi-colon in my stylish-portfolio.css.scss file. Anyways I will edit the question, thanks!

[Leo Costa]

On another notice if you could give me a hand on another error I'm having I would very much appreciate (stackoverflow.com/questions/21142113/…). I've been googling for a long time now and still can't find a solution.

[iftheshoefritz]

To be clear: the issue is that it is specifically the @import 'bootstrap' line that needs to have a semi-colon at its end. The comment on the question about "that's not the file producing the error" appears to be related to some previous snippet that the asker posted, but it made me misinterpret "after" in this answer to mean, "somewhere lower in the file". Docs here github.com/twbs/bootstrap-sass#sass

[lime]

Thanks Fritz, I tried to edit the answer to clarify this a bit.

[Ege Ersoz]

Link to the original CSS file is dead.

[lime]

Thanks Ege, I edited the link to point to an older version of the file.