@dracor/react 0.7.0 → 0.9.0

package/README.md

@@ -27,8 +27,12 @@ module.exports = {
     './node_modules/@dracor/react/**/*.js',
     './src/**/*.{js,jsx,ts,tsx}',
   ],
-  // add the DraCor Tailwindcss plugin
-  plugins: [require('@dracor/react/tailwind')],
+  plugins: [
+    // main DraCor Tailwindcss customization
+    require('@dracor/react/tailwind'),
+    // support CETEIcean markup in the TEIText component
+    require('@dracor/react/ceteicean'),
+  ],
 
   // ... your customisations
 };

package/ceteicean.js

@@ -0,0 +1,46 @@
+const { textAlign } = require('tailwindcss-classnames');
+const plugin = require('tailwindcss/plugin');
+
+module.exports = plugin(({addBase, addComponents, theme}) => {
+  addBase({
+    'tei-div': {
+      display: 'block',
+    },
+    'tei-head': {
+      display: 'block',
+    },
+    'tei-p': {
+      display: 'block',
+      marginTop: theme('spacing.2'),
+      marginBottom: theme('spacing.2'),
+    },
+    'tei-front': {
+      display: 'block',
+      marginBottom: theme('spacing.6'),
+    },
+  });
+
+  addComponents({
+    'tei-front > tei-titlepage > tei-doctitle': {
+      display: 'block',
+      textAlign: 'center',
+      marginBottom: theme('spacing.4'),
+    },
+    'tei-doctitle > tei-titlepart[type=main]': {
+      fontSize: theme('fontSize.2xl'),
+      marginTop: theme('spacing.3'),
+      marginBottom: theme('spacing.3'),
+    },
+    'tei-doctitle > tei-titlepart[type=sub]': {
+      fontSize: theme('fontSize.xl'),
+      marginTop: theme('spacing.3'),
+      marginBottom: theme('spacing.3'),
+    },
+    'tei-div[type=chapter] > tei-head': {
+      fontSize: theme('fontSize.xl'),
+      fontWeight: 'bold',
+      marginTop: theme('spacing.8'),
+      marginBottom: theme('spacing.4'),
+    },
+  });
+});