feat: subtitles editor

tailwind.config.ts

@@ -20,9 +20,37 @@ export default <Partial<Config>>{
         sidebar: 'inset -2px 0 2px 0 rgba(0, 0, 0, .05)',
         sidebar_dark: 'inset -2px 0 2px 0 rgba(255, 255, 255, .05)',
       },
+      textShadow: {
+        'default': '2px 2px 5px grey',
+        'md': '4px 4px 10px grey',
+        'lg': '6px 6px 15px grey',
+      },
     },
   },
-  plugins: [typography],
+  plugins: [
+    typography,
+    function ({ addUtilities }: { addUtilities: Function }) {
+      const newUtilities = {
+        '.text-shadow': {
+          textShadow: '2px 2px 5px grey',
+        },
+        '.text-shadow-md': {
+          textShadow: '4px 4px 10px grey',
+        },
+        '.text-shadow-lg': {
+          textShadow: '6px 6px 15px grey',
+        },
+        '.text-stroke': {
+          '-webkit-text-stroke': '1px black',
+        },
+        '.text-stroke-2': {
+          '-webkit-text-stroke': '2px black',
+        },
+      }
+
+      addUtilities(newUtilities, ['responsive', 'hover'])
+    },
+  ],
   safelist: [
     {
       pattern: /^bg-/,