diff --git a/src/components/GlassmorphicBadge.tsx b/src/components/GlassmorphicBadge.tsx new file mode 100644 index 0000000..aa43e05 --- /dev/null +++ b/src/components/GlassmorphicBadge.tsx @@ -0,0 +1,15 @@ +type GlassmorphicBadgeProps = { + fact: string; +}; + +const GlassmorphicBadge = ({ fact }: GlassmorphicBadgeProps) => { + return ( +
+

+ Fun Fact: {fact} +

+
+ ); +}; + +export default GlassmorphicBadge; \ No newline at end of file diff --git a/src/components/sections/about/AboutMediaOverlay.tsx b/src/components/sections/about/AboutMediaOverlay.tsx index fb57149..e8d8e8a 100644 --- a/src/components/sections/about/AboutMediaOverlay.tsx +++ b/src/components/sections/about/AboutMediaOverlay.tsx @@ -2,6 +2,8 @@ import { motion } from "motion/react"; import Button from "@/components/ui/Button"; import TextAnimation from "@/components/ui/TextAnimation"; import ImageOrVideo from "@/components/ui/ImageOrVideo"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; type AboutMediaOverlayProps = { tag: string; @@ -21,7 +23,8 @@ const AboutMediaOverlay = ({ videoSrc, }: AboutMediaOverlayProps) => { return ( -
+
+
diff --git a/src/components/sections/features/FeaturesTaggedCards.tsx b/src/components/sections/features/FeaturesTaggedCards.tsx index 90a15e5..5997b64 100644 --- a/src/components/sections/features/FeaturesTaggedCards.tsx +++ b/src/components/sections/features/FeaturesTaggedCards.tsx @@ -1,92 +1,43 @@ -import { motion } from "motion/react"; -import Button from "@/components/ui/Button"; -import TextAnimation from "@/components/ui/TextAnimation"; -import ImageOrVideo from "@/components/ui/ImageOrVideo"; -import GridOrCarousel from "@/components/ui/GridOrCarousel"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; type FeatureItem = { tag: string; title: string; description: string; - primaryButton?: { text: string; href: string }; - secondaryButton?: { text: string; href: string }; -} & ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never }); + imageSrc: string; +}; -interface FeaturesTaggedCardsProps { +type FeaturesTaggedCardsProps = { tag: string; title: string; description: string; - primaryButton?: { text: string; href: string }; - secondaryButton?: { text: string; href: string }; items: FeatureItem[]; -} +}; -const FeaturesTaggedCards = ({ - tag, - title, - description, - primaryButton, - secondaryButton, - items, -}: FeaturesTaggedCardsProps) => { +const FeaturesTaggedCards = ({ tag, title, description, items }: FeaturesTaggedCardsProps) => { return ( -
-
-
- {tag} - - - - - - {(primaryButton || secondaryButton) && ( -
- {primaryButton &&
- )} +
+ +
+
+ {tag} +

{title}

+

{description}

+
+
+ {items.map((item) => ( +
+ {item.title} + {item.tag} +

{item.title}

+

{item.description}

+
+ ))}
- - - - {items.map((item) => ( -
-
- - {item.tag} -
-
-

{item.title}

-

{item.description}

- {(item.primaryButton || item.secondaryButton) && ( -
- {item.primaryButton &&
- )} -
-
- ))} - -
); }; -export default FeaturesTaggedCards; +export default FeaturesTaggedCards; \ No newline at end of file diff --git a/src/components/sections/hero/HeroBillboard.tsx b/src/components/sections/hero/HeroBillboard.tsx index 4ea37ad..5964b89 100644 --- a/src/components/sections/hero/HeroBillboard.tsx +++ b/src/components/sections/hero/HeroBillboard.tsx @@ -1,7 +1,6 @@ -import { motion } from "motion/react"; import Button from "@/components/ui/Button"; -import TextAnimation from "@/components/ui/TextAnimation"; -import ImageOrVideo from "@/components/ui/ImageOrVideo"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; type HeroBillboardProps = { tag: string; @@ -9,7 +8,8 @@ type HeroBillboardProps = { description: string; primaryButton: { text: string; href: string }; secondaryButton: { text: string; href: string }; -} & ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never }); + imageSrc: string; +}; const HeroBillboard = ({ tag, @@ -18,45 +18,22 @@ const HeroBillboard = ({ primaryButton, secondaryButton, imageSrc, - videoSrc, }: HeroBillboardProps) => { return ( -
-
-
- {tag} - - - - - -
-
+
+ +
+ {tag} +

{title}

+

{description}

+
+
- - - - + {title}
); }; -export default HeroBillboard; +export default HeroBillboard; \ No newline at end of file diff --git a/src/components/sections/metrics/MetricsSimpleCards.tsx b/src/components/sections/metrics/MetricsSimpleCards.tsx index 998a33a..2c773b7 100644 --- a/src/components/sections/metrics/MetricsSimpleCards.tsx +++ b/src/components/sections/metrics/MetricsSimpleCards.tsx @@ -1,72 +1,39 @@ -import { motion } from "motion/react"; -import Button from "@/components/ui/Button"; -import TextAnimation from "@/components/ui/TextAnimation"; -import GridOrCarousel from "@/components/ui/GridOrCarousel"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; type Metric = { value: string; description: string; }; -const MetricsSimpleCards = ({ - tag, - title, - description, - primaryButton, - secondaryButton, - metrics, -}: { +type MetricsSimpleCardsProps = { tag: string; title: string; description: string; - primaryButton?: { text: string; href: string }; - secondaryButton?: { text: string; href: string }; metrics: Metric[]; -}) => ( -
-
-
- {tag} +}; - - - - - {(primaryButton || secondaryButton) && ( -
- {primaryButton &&
- )} -
- - - +const MetricsSimpleCards = ({ tag, title, description, metrics }: MetricsSimpleCardsProps) => { + return ( +
+ +
+
+ {tag} +

{title}

+

{description}

+
+
{metrics.map((metric) => ( -
- {metric.value} -

{metric.description}

+
+

{metric.value}

+

{metric.description}

))} - - -
-
-); +
+
+
+ ); +}; -export default MetricsSimpleCards; +export default MetricsSimpleCards; \ No newline at end of file diff --git a/src/components/sections/product/ProductMediaCards.tsx b/src/components/sections/product/ProductMediaCards.tsx index 7ae3a37..0faea53 100644 --- a/src/components/sections/product/ProductMediaCards.tsx +++ b/src/components/sections/product/ProductMediaCards.tsx @@ -1,120 +1,41 @@ -import { ArrowUpRight, Loader2 } from "lucide-react"; -import { motion } from "motion/react"; -import Button from "@/components/ui/Button"; -import TextAnimation from "@/components/ui/TextAnimation"; -import ImageOrVideo from "@/components/ui/ImageOrVideo"; -import GridOrCarousel from "@/components/ui/GridOrCarousel"; -import useProducts from "@/hooks/useProducts"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; + +type Product = { + name: string; + price: string; + imageSrc: string; +}; type ProductMediaCardsProps = { tag: string; title: string; description: string; - primaryButton?: { text: string; href: string }; - secondaryButton?: { text: string; href: string }; - products?: { - name: string; - price: string; - imageSrc: string; - onClick?: () => void; - }[]; + products: Product[]; }; -const ProductMediaCards = ({ - tag, - title, - description, - primaryButton, - secondaryButton, - products: productsProp, -}: ProductMediaCardsProps) => { - const { products: fetchedProducts, isLoading } = useProducts(); - const isFromApi = fetchedProducts.length > 0; - const products = isFromApi - ? fetchedProducts.map((p) => ({ - name: p.name, - price: p.price, - imageSrc: p.imageSrc, - onClick: p.onProductClick, - })) - : productsProp; - - if (isLoading && !productsProp) { - return ( -
-
- -
-
- ); - } - - if (!products || products.length === 0) { - return null; - } - +const ProductMediaCards = ({ tag, title, description, products }: ProductMediaCardsProps) => { return ( -
-
-
- {tag} - - - - - - {(primaryButton || secondaryButton) && ( -
- {primaryButton &&
- )} +
+ +
+
+ {tag} +

{title}

+

{description}

+
+
+ {products.map((product) => ( +
+ {product.name} +

{product.name}

+

{product.price}

+
+ ))}
- - - - {products.map((product) => ( - - ))} - -
); }; -export default ProductMediaCards; +export default ProductMediaCards; \ No newline at end of file diff --git a/src/components/sections/testimonial/TestimonialMarqueeCards.tsx b/src/components/sections/testimonial/TestimonialMarqueeCards.tsx index 996d8a5..3fc703a 100644 --- a/src/components/sections/testimonial/TestimonialMarqueeCards.tsx +++ b/src/components/sections/testimonial/TestimonialMarqueeCards.tsx @@ -2,6 +2,8 @@ import { motion } from "motion/react"; import Button from "@/components/ui/Button"; import TextAnimation from "@/components/ui/TextAnimation"; import ImageOrVideo from "@/components/ui/ImageOrVideo"; +import GlassmorphicBadge from "@/components/GlassmorphicBadge"; +import { getRandomFact } from "@/utils/facts"; type Testimonial = { name: string; diff --git a/src/utils/facts.ts b/src/utils/facts.ts new file mode 100644 index 0000000..7113db5 --- /dev/null +++ b/src/utils/facts.ts @@ -0,0 +1,14 @@ +export const funnyFacts: string[] = [ + "Our sourdough starter is named 'Dough-minatrix'. She's very demanding.", + "We once tried to make a bread so big it had its own zip code.", + "Our croissants are 99% butter, 1% magic. And a little bit of flour.", + "Legend says our head baker can communicate with yeast on a spiritual level.", + "We accidentally invented a new pastry. We call it the 'Oopsie-danish'.", + "Our cinnamon rolls are so good, they've been known to solve family disputes.", + "The secret ingredient is love. And an alarming amount of butter.", + "Our bakers sing to the bread. It makes the crust extra crispy.", +]; + +export const getRandomFact = (): string => { + return funnyFacts[Math.floor(Math.random() * funnyFacts.length)]; +}; \ No newline at end of file