gistfile1.txt

import { ArrowTopRightOnSquareIcon } from 'your-icon-library'; // Make sure to import your icon

// ...

<Link
  href={addToLinkedIn}
  target="_blank"
  className="col-span-2 text-center py-2 rounded-md text-lg font-bold border-2 relative transition-all duration-200"
  style={{
    backgroundImage: 'linear-gradient(45deg, #f83a3a 10%, #f13dd4 50%, #7000ff 90%)',
    backgroundClip: 'text',
    WebkitTextFillColor: 'transparent',
  }}
>
  <span className="flex items-center justify-center gap-3">
    Digital Marketing Masterclass (Free)
    <ArrowTopRightOnSquareIcon
      className="h-7 text-gradient bg-gradient-to-r from-red-600 via-pink-600 to-indigo-700 rounded-md"
      style={{
        border: '2px solid transparent',
        borderRadius: '6px',
      }}
    />
  </span>
</Link>

import { ArrowTopRightOnSquareIcon } from 'your-icon-library'; // Make sure to import your icon

// ...

<Link
  href={addToLinkedIn}
  target="_blank"
  className="col-span-2 text-center py-2 rounded-md text-lg font-bold border-2 relative transition-all duration-200"
  style={{
    backgroundImage: 'linear-gradient(45deg, #f83a3a 10%, #f13dd4 50%, #7000ff 90%)',
    backgroundClip: 'text',
    WebkitTextFillColor: 'transparent',
  }}
>
  <span className="flex items-center justify-center gap-3">
    Digital Marketing Masterclass (Free)
    <ArrowTopRightOnSquareIcon
      className="h-7"
      style={{
        stroke: 'url(#gradient)', // Apply the gradient to the stroke
        strokeWidth: '2px', // Adjust the stroke width as needed
        fill: 'transparent', // Make the icon background transparent
        borderRadius: '6px', // Add border-radius
      }}
    />
  </span>
  <svg className="hidden">
    <defs>
      <linearGradient id="gradient" x1="0" y1="0" x2="100%" y2="0">
        <stop offset="10%" stopColor="#f83a3a" />
        <stop offset="50%" stopColor="#f13dd4" />
        <stop offset="90%" stopColor="#7000ff" />
      </linearGradient>
    </defs>
  </svg>
</Link>