I am experiencing issues with importing my scss file.
First, I created a file called main.scss
and added some code to it.
All the codes are functioning properly and showing up on the webpage.
Next, I created two folders named settings and elements.
In the settings folder, I made a file named _colors.scss where I defined some color variables.
Then, in the elements folder, I created a file called _typography.scss
and wrote some code in it.
Now, when I tried to import them into main.scss,
they didn't get imported. I'm unsure why this is happening. Can someone please assist me?
Here is my final code:
/src/css/main.scss
:
@import "elements/typography";
@import "settings/colors";
/src/css/elements/_typography.scss
:
a {
line-height: inherit;
cursor: pointer;
border-bottom: 1px solid;
text-decoration: none;
color: $primary-colour;
word-break: break-all;
word-break: break-word;
&:visited {
border-bottom: 1px solid;
}
&:hover {
border-bottom: none;
}
&:active {
color: $primary-colour;
}
&:focus {
border: none;
}
}
/src/css/settings/_colors.scss
:
$primary-colour: rgb(32, 221, 174);