Social media dashboard with theme switcher with SCSS
Design comparison
Solution retrospective
This is my first time using SCSS. I have some questions:
- Is my organization in .scss files fine? If not, what can I do to improve.
- I cannot use background-image: url("images/....svg"). I have to upload them to get links. I don't know why it doesn't work.
Any suggestions are welcome. Thank you!
Community feedback
- @oliveridsPosted almost 3 years ago
I think your scss organization looks just fine, but I think you could join the _color.scss and the _variables.scss into the same file. Though it isn't necessary, it's fine the way it is.
Your background-image property does not work because you aren't correctly accessing them. Sass compiler is literally just a compiler, it's not the final file. When you want to use an image as a background, you have to remember that you need to access them while you're inside the CSS FOLDER, because that's where the SASS files are being compiled into. Since your images are in a folder OUTSIDE of the css folder, you need to "go back" in the adress, and you do that by adding a "./" to it.
Your images can be accessed by: background-image: "./images/ ...".
Marked as helpful0@NhanPhamTrongPosted almost 3 years ago@oliverids Hello! I separate _colors.scss and _variables.scss because initially, I thought this project may have lots of types of variable, not only colors. That's why I split them. And thanks for your suggestion, I've solved my problem with background image. Thank you very much!
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord