Tailwind more pseudo classes and variants

tailwind-config.js

variants: {
    margin: ['responsive', 'last-child', 'first-child', 'odd-child', 'even-child'],
},
plugins: [
    function({ addVariant, e }) {
        addVariant('first-child', ({ modifySelectors, separator }) => {
        modifySelectors(({ className }) => {
            return `.${e(`first-child${separator}${className}`)}:first-child`
            })
        })
    },
    function({ addVariant, e }) {
        addVariant('last-child', ({ modifySelectors, separator }) => {
            modifySelectors(({ className }) => {
                return `.${e(`last-child${separator}${className}`)}:last-child`
            })
        })
    },
    function({ addVariant, e }) {
        addVariant('odd-child', ({ modifySelectors, separator }) => {
            modifySelectors(({ className }) => {
                return `.${e(`odd-child${separator}${className}`)}:nth-child(odd)`
            })
        })
    },
    function({ addVariant, e }) {
        addVariant('even-child', ({ modifySelectors, separator }) => {
            modifySelectors(({ className }) => {
                return `.${e(`even-child${separator}${className}`)}:nth-child(even)`
            })
        })
    },
]