fix: update loyalty cards and join loyalty sidebar design

components/TempDesignSystem/Text/BiroScript/biroScript.module.css

@@ -26,6 +26,14 @@
   line-height: var(--typography-Script-2-lineHeight);
 }
 
+.tiltedSmall {
+  transform: rotate(-2deg);
+}
+
+.tiltedLarge {
+  transform: rotate(-13deg) translate(0px, -15px);
+}
+
 .center {
   text-align: center;
 }

components/TempDesignSystem/Text/BiroScript/index.tsx

@@ -10,6 +10,7 @@ export default function BiroScript({
   color,
   textAlign,
   type,
+  tilted,
   ...props
 }: BiroScriptProps) {
   const Comp = asChild ? Slot : "span"
@@ -18,6 +19,7 @@ export default function BiroScript({
     color,
     textAlign,
     type,
+    tilted,
   })
   return <Comp className={classNames} {...props} />
 }

components/TempDesignSystem/Text/BiroScript/variants.ts

@@ -19,6 +19,10 @@ const config = {
       one: styles.one,
       two: styles.two,
     },
+    tilted: {
+      small: styles.tiltedSmall,
+      large: styles.tiltedLarge,
+    },
   },
   defaultVariants: {
     type: "one",