separate greentext into "fun text" and make Post/Notification related components

1 files changed, 40 insertions, 0 deletions

diff --git a/src/components/fun_text.style.js b/src/components/fun_text.style.js
new file mode 100644
index 00000000..2d3ac154
--- /dev/null
+++ b/src/components/fun_text.style.js
@@ -0,0 +1,40 @@
+export default {
+  name: 'FunText',
+  selector: '/*fun-text*/',
+  virtual: true,
+  variants: {
+    greentext: '.greentext',
+    cyantext: '.cyantext'
+  },
+  states: {
+    faint: '.faint'
+  },
+  defaultRules: [
+    {
+      directives: {
+        textColor: '--text',
+        textAuto: 'preserve'
+      }
+    },
+    {
+      state: ['faint'],
+      directives: {
+        textOpacity: 0.5
+      }
+    },
+    {
+      variant: 'greentext',
+      directives: {
+        textColor: '--cGreen',
+        textAuto: 'preserve'
+      }
+    },
+    {
+      variant: 'cyantext',
+      directives: {
+        textColor: '--cBlue',
+        textAuto: 'preserve'
+      }
+    }
+  ]
+}