(fix): correctly apply foreground and background colours to theme wrapper

src/app/modules/pro/channel/channel.component.ts

@@ -267,7 +267,7 @@ export class ProChannelComponent implements OnInit, AfterViewInit, OnDestroy {
  return '';
  }
 
- return `m-theme--wrapper__${this.channel.pro_settings.scheme || 'light'}`;
+ return `m-theme--wrapper m-theme--wrapper__${this.channel.pro_settings.scheme || 'light'}`;
  }
 
  @HostListener('window:resize') onResize() {

src/stylesheets/main.scss

 @import 'defaults';
 @import 'fonts';
 
-body.m-theme__light {
+body.m-theme__light,
+body .m-theme--wrapper.m-theme--wrapper__light {
  color: rgba(0, 0, 0, 0.87);
  background-color: #fff;
 }
 
-body.m-theme__dark {
+body.m-theme__dark,
+body .m-theme--wrapper.m-theme--wrapper__dark {
  color: rgba(255, 255, 255, 0.87);
  background-color: #080808;
 }

src/stylesheets/themes.scss

@@ -3,7 +3,7 @@
 @mixin m-theme() {
  @each $theme, $colors in $themes {
  body.m-theme__#{$theme} &,
- body .m-theme--wrapper__#{$theme} & {
+ body .m-theme--wrapper.m-theme--wrapper__#{$theme} & {
  $theme-map: () !global;
  @each $color-name, $color in $colors {
  $value: map-get(map-get($themes, $theme), '#{$color-name}');