From 1e60c9309ada708c5654633f814fe4f3638f0c16 Mon Sep 17 00:00:00 2001
From: Dino Danic <dino.danic@gmail.com>
Date: Tue, 27 Feb 2024 12:29:52 +0100
Subject: [PATCH] add kodiui

---
 apps/bible/components/typography/heading.tsx  |  8 +++----
 apps/bible/components/typography/text.tsx     | 23 ++++---------------
 .../components/typography/tokens/text.ts      |  2 +-
 3 files changed, 9 insertions(+), 24 deletions(-)

diff --git a/apps/bible/components/typography/heading.tsx b/apps/bible/components/typography/heading.tsx
index c996086..8b059d5 100644
--- a/apps/bible/components/typography/heading.tsx
+++ b/apps/bible/components/typography/heading.tsx
@@ -10,11 +10,11 @@ type HeadingProps = VariantProps<typeof headingVariants> &
     className?: string;
   };
 
-const headingVariants = cva("m-0 p-0", {
+const headingVariants = cva("", {
   variants: {
     level: {
       "1": "text-4xl lg:text-5xl leading-none",
-      "2": "text-3xl transition-colors first:mt-0 leading-none",
+      "2": "text-3xl leading-none",
       "3": "text-2xl leading-none",
       "4": "text-xl leading-none",
     },
@@ -31,7 +31,7 @@ const headingVariants = cva("m-0 p-0", {
 
 const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(
   (
-    { level = "1", children, className, textAlign, weight, color, ...props },
+    { level = "1", children, className, textAlign, weight, tone, ...props },
     ref
   ) => {
     const Comp = `h${level}` as "h1" | "h2" | "h3" | "h4";
@@ -39,7 +39,7 @@ const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(
       <Comp
         className={cn(
           headingVariants({ level, weight }),
-          textVariants({ textAlign, color }),
+          textVariants({ textAlign, tone }),
           className
         )}
         ref={ref}
diff --git a/apps/bible/components/typography/text.tsx b/apps/bible/components/typography/text.tsx
index 2858b78..215978e 100644
--- a/apps/bible/components/typography/text.tsx
+++ b/apps/bible/components/typography/text.tsx
@@ -24,39 +24,24 @@ const textCustomVariants = cva("inline-block [&>svg]:inline-block", {
       medium: "font-medium",
       bold: "font-bold",
     },
-    tone: {
-      base: "text-white",
-      muted: "text-gray-500",
-    },
   },
   defaultVariants: {
-    size: "base",
+    size: "sm",
     weight: "base",
-    tone: "base",
   },
 });
 
 const Text = React.forwardRef<HTMLParagraphElement, TextProps>(
   (
-    {
-      withIcon,
-      size,
-      weight,
-      className,
-      tone,
-      color,
-      children,
-      textAlign,
-      ...props
-    },
+    { withIcon, size, weight, className, tone, children, textAlign, ...props },
     ref
   ) => {
     const Comp = withIcon ? "span" : "p";
     return (
       <Comp
         className={cn(
-          textCustomVariants({ size, weight, tone, className }),
-          textVariants({ textAlign, color })
+          textCustomVariants({ size, weight, className }),
+          textVariants({ textAlign, tone })
         )}
         ref={ref}
         {...props}
diff --git a/apps/bible/components/typography/tokens/text.ts b/apps/bible/components/typography/tokens/text.ts
index ebaa68a..601d36d 100644
--- a/apps/bible/components/typography/tokens/text.ts
+++ b/apps/bible/components/typography/tokens/text.ts
@@ -10,7 +10,7 @@ export const textVariants = cva("", {
       start: "text-start",
       end: "text-end",
     },
-    color: {
+    tone: {
       brand: "text-brand",
       muted: "text-muted-foreground",
     },