From 44a26cb8ea06b13b3cec20f98d357b78968545a9 Mon Sep 17 00:00:00 2001 From: adilallo <39313955+adilallo@users.noreply.github.com> Date: Mon, 25 Aug 2025 15:52:39 -0600 Subject: [PATCH] Quote Block default breakpoint added --- app/components/QuoteBlock.js | 49 ++++++++++++++++++++++++++++++++++ app/components/QuoteDecor.js | 42 +++++++++++++++++++++++++++++ app/components/RuleStack.js | 32 +++++++++++++--------- app/page.js | 2 ++ public/assets/Quote_Avatar.svg | 9 +++++++ 5 files changed, 121 insertions(+), 13 deletions(-) create mode 100644 app/components/QuoteBlock.js create mode 100644 app/components/QuoteDecor.js create mode 100644 public/assets/Quote_Avatar.svg diff --git a/app/components/QuoteBlock.js b/app/components/QuoteBlock.js new file mode 100644 index 0000000..50149af --- /dev/null +++ b/app/components/QuoteBlock.js @@ -0,0 +1,49 @@ +"use client"; + +import React from "react"; +import Image from "next/image"; +import QuoteDecor from "./QuoteDecor"; + +const QuoteBlock = ({ className = "" }) => { + return ( +
+ {/* DECORATIONS (behind content) */} + + +
+
+ Quote Avatar +
+

+ "The rules of decision-making must be open and + available to everyone, and this can happen only if they are + formalized." +

+
+
+
+

+ Jo Freeman +

+

+ "The Tyranny of Structurelessness" +

+
+
+
+ ); +}; + +export default QuoteBlock; diff --git a/app/components/QuoteDecor.js b/app/components/QuoteDecor.js new file mode 100644 index 0000000..6d7b9e9 --- /dev/null +++ b/app/components/QuoteDecor.js @@ -0,0 +1,42 @@ +"use client"; + +const QuoteDecor = ({ className = "" }) => { + return ( + + ); +}; + +export default QuoteDecor; diff --git a/app/components/RuleStack.js b/app/components/RuleStack.js index 0e43a6b..f5b9733 100644 --- a/app/components/RuleStack.js +++ b/app/components/RuleStack.js @@ -1,26 +1,32 @@ "use client"; -import SectionHeader from "./SectionHeader"; +import React from "react"; +import Image from "next/image"; import RuleCard from "./RuleCard"; import Button from "./Button"; -import Image from "next/image"; -const RuleStack = ({ children, className = "" }) => { +const RuleStack = ({ className = "" }) => { const handleTemplateClick = (templateName) => { - console.log(`Template selected: ${templateName}`); - // This would typically navigate to template details or open a modal - // For now, we'll just log the selection + // Basic analytics tracking + if (typeof window !== "undefined") { + if (window.gtag) { + window.gtag("event", "template_click", { + template_name: templateName, + }); + } + if (window.analytics) { + window.analytics.track("Template Clicked", { + templateName: templateName, + }); + } + } + console.log(`${templateName} template clicked`); }; return ( -
-
{ See all templates
-
+ ); }; diff --git a/app/page.js b/app/page.js index e6a48ad..ac8d1fd 100644 --- a/app/page.js +++ b/app/page.js @@ -2,6 +2,7 @@ import NumberedCards from "./components/NumberedCards"; import HeroBanner from "./components/HeroBanner"; import LogoWall from "./components/LogoWall"; import RuleStack from "./components/RuleStack"; +import QuoteBlock from "./components/QuoteBlock"; export default function Page() { const heroBannerData = { @@ -41,6 +42,7 @@ export default function Page() { + ); } diff --git a/public/assets/Quote_Avatar.svg b/public/assets/Quote_Avatar.svg new file mode 100644 index 0000000..50c8704 --- /dev/null +++ b/public/assets/Quote_Avatar.svg @@ -0,0 +1,9 @@ + + + + + + + + +