Artur Stary
Artur Stary

Reputation: 744

Sharing SASS vars between files, when file name is unknown

This is my stylesheet declaration code:

<link rel="stylesheet" href="username-theme.css">
<link rel="stylesheet" href="layout.css">

"username-theme.css" filename vary, ie john123-theme.css or jenifer-theme.css

I'm trying to solve the following problem:

in my layout.scss I want to use following code:

body{color:$theme-color}

where $theme-color comes from john123-theme.scss

Upvotes: 0

Views: 57

Answers (2)

iurii
iurii

Reputation: 4230

Have a look at the documentation.

so you can have a file smth like _variables.scss with your variables defined and then in your layout.scss you will include it like

@import 'variables';

so all the variables will be available there.

Upvotes: 1

Tim Jenkins
Tim Jenkins

Reputation: 111

You could try importing the other way, and at the end of your user stylesheet, import layout.scss. as long as the variable is defined before the import, it's value will be used in the layout.scss contents. Then you'll just have to link the user css file into the page, because it now includes everything you had in layout.scss. ex:

_layout.scss

body{color:$theme-color}

username-theme.scss

//define variable
$theme-color: #fff;

//import 
@import "layout";

Upvotes: 0

Related Questions