Sass Mixin Themify not Effecting Body - css

Question

I've inherited some SASS code used for theming from someone and it looks like it is only compiling into rules that target children of the element that has the themed class.
$themes:(
default:(
background:#CCCCCC
)
);
#mixin themify($themes: $themes) {
#each $theme, $map in $themes {
.theme-#{$theme} & {
$theme-map: () !global;
#each $key, $submap in $map {
$value: map-get(map-get($themes, $theme), '#{$key}');
$theme-map: map-merge($theme-map, ($key: $value)) !global;
}
#content;
$theme-map: null !global;
}
}
}
#function themed($key) {
#return map-get($theme-map, $key);
}
Gives a compiled css rule as
.theme-default body {
background-color: #CCCCCC;
}
The code seems fine but the highest element that can have the themed class is the body but then how can the body be given a themed property? I tried to add an additional mixin that will not use the children (just removing the & to invert the element relation)
#mixin themifyDirect($themes: $themes) {
#each $theme, $map in $themes {
.theme-#{$theme} {
$theme-map: () !global;
#each $key, $submap in $map {
$value: map-get(map-get($themes, $theme), '#{$key}');
$theme-map: map-merge($theme-map, ($key: $value)) !global;
}
#content;
$theme-map: null !global;
}
}
}
But this compiles into a css rule
body .theme-default {
background-color: #26282F; }
This is close but not enough because the rule I need is
body.theme-default {
background-color: #CCCCCC;
}
To target body which has the class

Answer 1

#mixin themifyDirect($themes: $themes) {
#each $theme, $map in $themes {
&.theme-#{$theme} {
$theme-map: () !global;
#each $key, $submap in $map {
$value: map-get(map-get($themes, $theme), '#{$key}');
$theme-map: map-merge($theme-map, ($key: $value)) !global;
}
#content;
$theme-map: null !global;
}
}
}
outputs
body.theme-default {
background-color: #CCCCCC;
}
You we're really close - note the leading '&' on line 3 which removes the space.