diff --git a/front/src/components/Rules/Rule.vue b/front/src/components/Rules/Rule.vue
index 5db22e1..c17bda3 100644
--- a/front/src/components/Rules/Rule.vue
+++ b/front/src/components/Rules/Rule.vue
@@ -1,7 +1,7 @@
 <template>
   <code 
     class="rule"
-    :class="rule.emoji_code"  
+    :class="myClass"  
   >
     <p :title="toEmojiCode(rule.className)">{{ rule.className }} {</p>
     <p v-for="dec in rule.rules" :key="dec">&nbsp; {{ dec }}</p>
@@ -17,9 +17,12 @@ export default {
   mixins: [emoji],
   props: ["rule"],
   computed: {
-    rawJSON() {
-      return "```json\n" + JSON.stringify(this.rule, null, 2) + "\n```";
-    },
+    myClass() {
+      return (
+        this.containsEmoji(this.rule.className) ?
+        'u' + this.toEmojiCode(this.rule.className) : null
+      )
+    }
   },
 };
 </script>
diff --git a/front/src/components/Rules/Styles.vue b/front/src/components/Rules/Styles.vue
index 938ab3c..8d2c313 100644
--- a/front/src/components/Rules/Styles.vue
+++ b/front/src/components/Rules/Styles.vue
@@ -27,22 +27,10 @@ export default {
   methods: {
     generateStyleRules() {
       let styles = "";
-      // this.rules.map(r => {
-      //   const dot = this.htmlTags.indexOf(r.className) > -1 ? '' : '.'
-      //   styles  += `.${r.parentClassName} ${dot}${r.className}`
-      //   if( this.containsEmoji(r.className)){
-      //     styles += `, .${r.parentClassName} .u${this.toEmojiCode(r.className)}` 
-      //   }
-      //   styles += "{"
-      //   r.rules.map((s)=>{
-      //     styles += s.text;
-      //   })
-      //   styles += "}"
-      // })
       this.rules.map((r) => {
-        styles += r.className;
+        styles  += `.${r.parentClassName} ${r.className}`
         if (this.containsEmoji(r.className)) {
-          styles += ", .u" + this.toEmojiCode(r.className);
+          styles += `, .${r.parentClassName} .u${this.toEmojiCode(r.className)}` 
         }
         styles += "{";
         r.rules.map((s) => {
diff --git a/front/src/store/index.js b/front/src/store/index.js
index f36419a..526790e 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -26,7 +26,7 @@ let toCSS = (message, currentStream) => {
     }
     rules = results[0]['groups']['props'].split("\n");
     rules = rules.filter((rule) => validateRule(rule))
-    return { className, emoji_code, rules };
+    return { className, emoji_code, rules, parentClassName };
   }
   return null;
 }