resend / react-email

💌 Build and send emails using React
https://react.email
MIT License
14.38k stars 657 forks source link

Link component text-decoration messing up with tailwindcss styles #1682

Closed leandrodragani closed 1 week ago

leandrodragani commented 1 month ago

Describe the Bug

Tailwind underline class not getting applied because of hardcoded text-decoration: none; on Link component.

Which package is affected (leave empty if unsure)

@react-email/link

Link to the code that reproduces this issue

https://github.com/resend/react-email/blob/canary/packages/link/src/__snapshots__/link.spec.tsx.snap

To Reproduce

 <Section className="mt-10 border-t border-solid border-[#E1E1E1] pt-8 text-center">
    <Text className="m-0 text-base text-gray-600">
      Need to make a change?{' '}
      <Link
        href="#"
        className="text-gray-600 underline"
        style={{ textDecoration: 'underline' }}
      >
        Cancel
      </Link>{' '}
      or{' '}
      <Link href="#" className="text-gray-600 underline">
        Reschedule
      </Link>
    </Text>
  </Section>

CleanShot 2024-09-15 at 18 13 45@2x

Expected Behavior

underline tailwind class should get applied to Link component

What's your node version? (if relevant)

No response

gabrielmfern commented 1 month ago

Can you check it out with @react-email/link@0.0.11-canary.0?