Sass is not working

JavaScript
1

Tell us what’s happening:

hi,
i am facing issue while applying sass. i added sass features but it does not show any change in it

Your code so far
https://codepen.io/Navbham/pen/MWyMWMB

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36.

Challenge: Build a Random Quote Machine

Link to the challenge:

2
  1. You’re going to have to be specific.
  2. At least in the link you’ve provided, you haven’t written SASS, it looks like SCSS.
3

i am following the sass tutorials of frontend from freecodecamp. it has tutorials of sass only not the scss
i am very new to this stuff not sure what to do

4

Well, SASS, and SCSS are basically the same thing. (SCSS means “sassy CSS”). The difference is that with SASS, you remove a lot of the “boilerplace” characters, especially curly braces an semicolons.

So, this would be valid SCSS (and in this case valid CSS):

body {
  background-size: cover;
}

and this would be the same in SASS:

body
  background-size: cover

See, it’s the same thing, just with the “extra” stuff removed.

So, SASS and SCSS are basically the same thing. The difference between them is that they add extra features on top of CSS. Another observation is that CSS is valid SCSS but it isn’t valid SASS (unless you remove all the “extra” stuff.)

So, you can either call what you have SASS and get rid of the “extra” stuff. Or you can call it SCSS and change the preprocessor (by clicking on the settings icon next to “CSS” at the top of the CSS pane).

5

i have changed the preprocessor to scss but it still does not work.
may be there would be something else that is creating the problem…because i followed what was in the tutorials
look at it…https://www.freecodecamp.org/learn/front-end-libraries/sass/create-reusable-css-with-mixins

6

because i followed what was in the tutorials

Right, but did you notice the first line?

<style type='text/scss'>

i have changed the preprocessor to scss but it still does not work.

You’re going to have to be more specific about what the problem is. When I look at your pen, it looks like SCSS is on and is doing its job.

7

Yep…its working now
thank you