gistfile1.txt

const mdx = require('@mdx-js/mdx');

module.exports = {
  purge: {
    enabled: true,
    mode: 'all',
    content: [
      './**/*.html',
      './**/*.jsx',
      './**/*.mdx',
      './**/*.md',
      './**/*.js',
      './next.config.js',
    ],
    options: {
      extractors: [
        {
          extensions: ['mdx'],
          extractor: (content) => {
            content = mdx.sync(content);

            // Capture as liberally as possible, including things like `h-(screen-1.5)`
            const broadMatches = content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || [];

            // Capture classes within other delimiters like .block(class="w-1/2") in Pug
            const innerMatches =
              content.match(/[^<>"'`\s.(){}[\]#=%]*[^<>"'`\s.(){}[\]#=%:]/g) ||
              [];

            return broadMatches.concat(innerMatches);
          },
        },
      ],
    },
  },
  theme: {
    typography: (theme) => ({
      default: {
        css: {
          color: theme('colors.primary-text'),
          h1: {
            color: theme('colors.primary-blue'),
            fontWeight: theme('fontWeight.semibold'),
          },
          h2: {
            color: theme('colors.primary-green'),
            fontWeight: theme('fontWeight.semibold'),
          },
          a: {
            color: theme('colors.primary-green'),
            '&:hover': {
              color: theme('colors.primary-blue'),
            },
          },
          blockquote: {
            borderColor: theme('colors.primary-green'),
          },
          thead: {
            th: {
              p: {
                marginTop: '0.125rem !important',
                marginBottom: '0.125rem !important',
                fontSize: '1.25rem !important',
              },
            },
          },
          tbody: {
            tr: {
              p: {
                marginTop: '0.125rem !important',
                marginBottom: '0.125rem !important',
              },
            },
          },
        },
      },
    }),