@netlify/tailwind-config/plugins/actions-flex-gap.js

Netlify's Tailwind CSS configuration

const plugin = ({ addUtilities, theme, e, variants }) => {
  const actionsFlexGap = theme('actionsFlexGap', {});
  const actionsFlexGapVariants = variants('actionsFlexGap', []);

  const actionsFlexGapUtilities = Object.entries(actionsFlexGap).map(
    ([name, value]) => {
      return {
        [`.${e(`actions-flex-gap-${name}`)} > *:not(:first-child)`]: {
          'margin-top': value,
        },
        [`@screen md`]: {
          [`.${e(`actions-flex-gap-${name}`)} > *`]: {
            'margin-top': 0,
          },
          [`.${e(`actions-flex-gap-${name}`)} > *:not(:first-child)`]: {
            'margin-top': 0,
            'margin-left': value,
          },
        },
      };
    }
  );
  addUtilities(actionsFlexGapUtilities, actionsFlexGapVariants);
};

module.exports = require('tailwindcss/plugin')(plugin);