Maybe I'm just too hung-up on PHP. Guilty as charged, if that's the case.
I have a set of variables I've named for WordPress categories that are important to my website. Each of these corresponds to an RGBA value like this:
// Category Styles:
$technology : rgba(91, 23, 102, 1);
$science : rgba(186, 6, 38, 1);
$rochester : rgba(224, 64, 28, 1);
$politics : rgba(10, 82, 60, 1);
$journalism : rgba(224, 176, 11, 1);`
Now what I'd like to do is create a mixin that will automatically handle the largest part of the dirty work of applying these color styles to classes. This was my attempted solution:
@mixin category-backgrounds( $collection: ( 'science', 'technology', 'politics', 'rochester', 'journalism' ) ) {
@each $category in $collection {
.bg-#{$category} {
background-color: $#{$category};
}
.fg-#{$category} {
color: $#{$category};
}
}
}
I'm trying to substitute the value of the collection element for the name of a variable, in other words. I'll bet anything there's an easy way to go about this, but I'm new to SASS and Ruby.
In PHP, of course, I can validly say $$category, but here I cannot. That seems largely because the #{} interpolation puts quotation marks around the result. But is there a way to do this that I'm not seeing? Or an easier way altogether?
Thank you very much.