feat: add sheen for light and dark mode in license card

Author: arunjaindev

src/Shared/Components/DevtronLicenseCard/DevtronLicenseCard.tsx

@@ -4,6 +4,7 @@ import { ClipboardButton, getTTLInHumanReadableFormat } from '@Common/index'
 import { ReactComponent as ICChatSupport } from '@IconsV2/ic-chat-circle-dots.svg'
 import { getThemeOppositeThemeClass } from '@Shared/Providers/ThemeProvider/utils'
 import {
+    AppThemeType,
     CONTACT_SUPPORT_LINK,
     DevtronLicenseCardProps,
     ENTERPRISE_SUPPORT_LINK,
@@ -31,6 +32,7 @@ export const DevtronLicenseCard = ({
     const remainingTime = getTTLInHumanReadableFormat(ttl)
     const remainingTimeString = ttl < 0 ? `Expired ${remainingTime} ago` : `${remainingTime} remaining`
     const isLicenseValid = licenseStatus !== LicenseStatus.EXPIRED
+    const isThemeDark = appTheme === AppThemeType.dark
 
     const cardRef = useRef<HTMLDivElement>(null)
 
@@ -69,12 +71,10 @@ export const DevtronLicenseCard = ({
     )
     const sheenPosition = useTransform(diagonalMovement, [-5, 5], [-100, 200])
 
-    const sheenOpacity = useTransform(sheenPosition, [-100, 50, 200], [0, 0.05, 0])
-    const sheenGradient = useMotionTemplate`linear-gradient(
-    55deg,
-    transparent,
-    rgba(255 255 255 / ${sheenOpacity}) ${sheenPosition}%,
-    transparent)`
+    const sheenOpacity = useTransform(sheenPosition, [-100, 50, 200], [0, isThemeDark ? 0.25 : 0.1, 0])
+    const sheenGradient = isThemeDark
+        ? useMotionTemplate`linear-gradient(55deg, transparent, rgba(122, 127, 131, ${sheenOpacity}) ${sheenPosition}%, transparent)`
+        : useMotionTemplate`linear-gradient(55deg, transparent, rgba(255, 255, 255, ${sheenOpacity}) ${sheenPosition}%, transparent)`
 
     return (
         <div className="flexbox-col p-8 br-16" style={{ backgroundColor: bgColor }}>