Make sure all windows are transparent by default

Author: larsbaunwall

presenter-app/src/assets/scss/plodo.scss

@@ -59,7 +59,13 @@ $link-focus-border: $secondary;
 $card-shadow: 0 0.5em 1em -0.125em rgba($primary, 0.1), 0 0px 0 1px rgba($primary, 0.02);
 
 $body-overflow-y: auto;
-$body-background-color: $white-bis;
+
+// Make sure that window transparency is maintained
+$body-background-color: none!important;
+
+html {
+    background-color: none!important;
+}
 
 .justify-content-center {
     justify-content: center;

presenter-app/src/components/SmileyCounter.vue

@@ -140,7 +140,8 @@ export default {
 }
 
 .trend {
-  margin-left: -1.5rem;
+  position:relative;
+  margin-left: -1rem;
 }
 
 .smiley {

presenter-app/src/views/CelebrationScreen.vue

@@ -32,8 +32,8 @@ export default {
     this.unsubscribe();
   },
   mounted() {
-    document.documentElement.style.background = "none";
-    document.body.style.background = "none";
+    // document.documentElement.style.background = "none";
+    // document.body.style.background = "none";
 
     this.two.appendTo(document.body);
 

presenter-app/src/views/MainLayout.vue

@@ -27,10 +27,12 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+@import "~bulma/sass/utilities/_all";
 #app {
   display: flex;
   min-height: 100vh;
   flex-direction: column;
+  background-color: $white-bis;
 }
 
 .main-section {