/* Sass Document */
$color_main: '#0671B2';
$color_secundary: '#019FAA';
a{color:$color_main}
Dreamweaver 2017 return this:
body:before { white-space: pre; font-family: monospace; content:
"Error: Invalid CSS after \"'#0671B2'\": expected expression (e.g.
1px, bold), was \";\"\A on line 3 of
D:\Servidores\EasyPHP-12.1\www\2016\Buzzon\BuzzonWeb\assets\css\style.sass\A
\A 1: /* Sass Document */\A 2: \A 3: $color_main: '#0671B2';\A 4:
$color_secundary: '#019FAA';\A 5: \A 6: a{color:$color_main}"; }
Ok I found the problem, the file extension of my file was .sass the correct is .scss and problem solved!
Related
Here is the .sass file:
/* Welcome to Compass.
*
* ie.sass
*
* Use this file to write IE specific override styles.
*
* Import this file using the following HTML or equivalent:
* <!--[if IE]>
* <link rel="stylesheet" type="text/css"
* href="/stylesheets/ie.css" media="screen, projection" />
* <![endif]-->
*/
html {
font-size: 24px;
}
Here is the error generated by Koala:
/*
Error: Invalid CSS after "html ": expected selector, was "{"
on line 14 of /Users/johnlove/Sites/www.lovetoteach.dev/Web_Site_Storage/lovesongforever.com/coronavirus/Coronavirus_Support/sass_test/ie_test.sass
9: * <link rel="stylesheet" type="text/css"
10: * href="/stylesheets/ie.css" media="screen, projection" />
11: * <![endif]-->
12: *\/
13:
14: html {
15:
16: }
I've made certain all properties are indented once. I have also eliminated the {} and trailing semi-colons.
Same error!
Why?
The answer is that even the resident sass compiler demands that the input sass file does not have either {} or the trailing ;
So, when I eliminate both, the sass compiler registers success.
I thought either with or without {} and with or without ; was acceptable?
I have answered my original question, only to replace it with a different question?
I finally forced myself to decide which I liked best. It is clear that I strongly prefer SASC because I strongly prefer the {} over the indented syntax of SASS. Don’t really care too much about semicolons, but I abhor relying on indentation.
So SASC wins also because just changing the file extension from .css to .sasc makes the newly named .sasc compile as a SASC file
I want to add a path prefix in an #import in my main theme.scss file but am getting the error Unexpected interpolation.
(I am using interpolation because the variable is in a string.)
$path-prefix: "../Scss/";
// No error on this
.test::before {
content: "#{$path-prefix}";
}
// But this produces and error
#import "#{$path-prefix}variables";
I have a file _content-sidebar.scss at this location:
C:\Users\user\Downloads\livemath\sass\layout\_content-sidebar.scss
Which contains the following code:
#import "//variables-site/structure";
.content-area {
float: left;
margin: 0 (-$size__site-sidebar) 0 0;
width: $size__site-main;
}
And I have another file called _structure.scss at this location:
C:\Users\user\Downloads\livemath\sass\variables-site\_structure.scss
Which contains the following code:
$size__site-main: 960px;
$size__site-sidebar: 25%;
And when I'm trying to compile the scss file using the command line I'm getting this error:
Change detected to: sass/layout/_content-sidebar.scss
error sass/layout/_content-sidebar.scss (Line 5: Undefined variable: "$size__site-sidebar".)
You used double slashes for resources, that are not located at external locations:
C:\Users\user\Downloads\livemath\sass\layout\_content-sidebar.scss
and
C:\Users\user\Downloads\livemath\sass\variables-site\_structure.scss
You could write it with a dot #import "./variables-site/structure"; if it's in the root or maybe #import "../variables-site/structure"; to get into the other folder!
I tested the double slashes for internal resources in my project and it spitted out the same error (that the first occurrence of a variable is undefined)!
Normally it would state that the file couldn't be imported, but unfortunately this is not the case when using double slashes...
Error:
Running "autoprefixer:dist" (autoprefixer) task
File .tmp/styles/documentation.css created.
Warning: Can't parse CSS: Missing property value at line 66:21 in .tmp/styles/main.css Use --force to continue.
Line 66 points to the following code:
Source:
span {
#extent .md-body-1;
}
p {
#extent .md-body-1;
}
I can't extent a tag in scss? Or is a autoprefixer issue?
you need to use #extend not #extent
My scss file is this:
#import "compass/typography/lists/bullets";
.view-content ul
+no-bullets
This gives me an error on the page:
Syntax error: Invalid css after " +no-bullets": expected "{", was ""
However, when the rule looks like this:
.view-content ul {
#include no-bullets;
}
then it's OK and bullets are gone.
But I like the shorthand notation, how to enable using it?
You're right, I found the related documentation.
I tried the following and it works.
Then, I tried your and it didn't work until I remove the trailing ; on the import instruction.
#import "compass/typography/lists/bullets"
.view-content ul
+no-bullets
The following works with Compass 0.12.2. Try removing the trailing ; on the import instruction.