Broadway 8


#1

In Broadway 8 how/what do I write for the
2) Write CSS in app/assets/stylesheets/pages.css.scss to display them on the same line.
I see that it says
You can use Sass (SCSS) here: http://sass-lang.com/
so how do I link it or do I have to write my own CSS?


#2

Hi Matthew,

Sass and SCSS are processors, which are different from frameworks (which I think you're thinking about). So, you can't link SCSS really. You do have to write your own CSS, but that's where SCSS comes in - it makes writing CSS easier. For a basic-ish example, look at this:

$bold-yellow: #F9E102;

.main-header {
  padding: 10px;
  margin-top: 14vh;
  
  font: {
    size: 60px;
    weight: bolder;
    style: italic;
  }

  mark {
    background-color: $bold-yellow
  }
}

Compared to what the CSS would compille out to be:

.main-header {
  padding: 10px;
  margin-top: 14vh;
  
  font-size: 60px;
  font-weight: bolder;
  font-style: italic;
}

.main-header mark {
  background-color: #F9E102;
}

SCSS has a lot of advantages over writing regular CSS, this is just a very basic example compared to some of the stuff SCSS can do.