From 710f0861434f007d866db793921059453604bff8 Mon Sep 17 00:00:00 2001
From: Tobiasz Gleba <tobiasz.gleba24@gmail.com>
Date: Fri, 22 Aug 2025 15:10:44 +0200
Subject: [PATCH 1/4] feat: add Gmail notification component and icon to
 marketing app

---
 apps/marketing-app/public/gmail-icon.png      | Bin 0 -> 18374 bytes
 apps/marketing-app/src/app/(app)/page.tsx     |   2 +
 .../src/app/components/gmail-notification.tsx |  56 ++++++++++++++++++
 3 files changed, 58 insertions(+)
 create mode 100644 apps/marketing-app/public/gmail-icon.png
 create mode 100644 apps/marketing-app/src/app/components/gmail-notification.tsx

diff --git a/apps/marketing-app/public/gmail-icon.png b/apps/marketing-app/public/gmail-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..1efe446530c647733005615aa1a544d9521bc40c
GIT binary patch
literal 18374
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
U3~kuySzy2nb&YkNX_IdJA7u(UuK)l5

literal 0
HcmV?d00001

diff --git a/apps/marketing-app/src/app/(app)/page.tsx b/apps/marketing-app/src/app/(app)/page.tsx
index 8ed67021..396a9de6 100644
--- a/apps/marketing-app/src/app/(app)/page.tsx
+++ b/apps/marketing-app/src/app/(app)/page.tsx
@@ -11,6 +11,7 @@ import { MobileMenu } from "../components/mobile-menu";
 import { Pricing } from "../components/pricing";
 import { ReviewCard } from "../components/review-card";
 import SavingsCalculator from "../components/savings-calculator";
+import { GmailNotification } from "../components/gmail-notification";
 import { TargetAudience } from "../components/target-audience";
 import { TrackCard } from "../components/track-card";
 import { UseItYourWay } from "../components/use-it-your-way";
@@ -28,6 +29,7 @@ export default async function Page(props: {
 
   return (
     <>
+      <GmailNotification />
       <header className="sticky top-3 z-50 mx-3 flex items-center justify-between gap-2 p-4.5 py-2.5 pr-2.5 max-sm:pr-4.5">
         <div className="border-border bg-background/80 absolute top-0 left-0 h-full w-full rounded-lg border backdrop-blur-[12px]" />
 
diff --git a/apps/marketing-app/src/app/components/gmail-notification.tsx b/apps/marketing-app/src/app/components/gmail-notification.tsx
new file mode 100644
index 00000000..8f1375ab
--- /dev/null
+++ b/apps/marketing-app/src/app/components/gmail-notification.tsx
@@ -0,0 +1,56 @@
+"use client";
+
+import { useState, useEffect } from "react";
+
+export function GmailNotification() {
+  const [isVisible, setIsVisible] = useState(false);
+
+  useEffect(() => {
+    // Show notification after a short delay when component mounts
+    const timer = setTimeout(() => {
+      setIsVisible(true);
+    }, 1500);
+
+    return () => {
+      clearTimeout(timer);
+    };
+  }, []);
+
+  return (
+    <div
+      className={`fixed top-20 right-2 z-[60] transition-all duration-500 ease-out p-2 ${
+        isVisible
+          ? "translate-x-0 opacity-100"
+          : "translate-x-full opacity-0"
+      }`}
+    >
+      {/* macOS notification container - glass effect */}
+      <div className="bg-black/20 backdrop-blur-3xl rounded-xl shadow-2xl w-96 overflow-hidden border border-white/10 ring-1 ring-black/5">
+        {/* Main content */}
+        <div className="px-4 pb-4 pt-4">
+          <div className="flex items-center gap-3">
+            {/* Gmail logo */}
+            <div className="w-16 h-16 bg-white rounded-full flex items-center justify-center flex-shrink-0 shadow-sm">
+              <img 
+                src="/gmail-icon.png" 
+                alt="Gmail"
+                className="w-12 h-12 object-contain"
+              />
+            </div>
+            
+            {/* Email content */}
+            <div className="flex-1 min-w-0">
+              <div className="mb-1">
+                <span className="text-white font-medium text-sm">What has been done this week?</span>
+              </div>
+              
+              <p className="text-white/80 text-sm leading-relaxed">
+                Hi, I'm your manager. It's time for portion of annoying questions about your work that has been done, or avoid this shit and use AsyncStatus.
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

From ba9a623071168c7cee1c12bfc6fd1066a39adeaf Mon Sep 17 00:00:00 2001
From: Tobiasz Gleba <tobiasz.gleba24@gmail.com>
Date: Fri, 22 Aug 2025 17:15:31 +0200
Subject: [PATCH 2/4] feat: make gmail notification look like in macos

---
 .../src/app/components/gmail-notification.tsx | 28 +++++++++++--------
 1 file changed, 17 insertions(+), 11 deletions(-)

diff --git a/apps/marketing-app/src/app/components/gmail-notification.tsx b/apps/marketing-app/src/app/components/gmail-notification.tsx
index 8f1375ab..1660ff80 100644
--- a/apps/marketing-app/src/app/components/gmail-notification.tsx
+++ b/apps/marketing-app/src/app/components/gmail-notification.tsx
@@ -11,41 +11,47 @@ export function GmailNotification() {
       setIsVisible(true);
     }, 1500);
 
+    // Hide notification after 7 seconds
+    const hideTimer = setTimeout(() => {
+      setIsVisible(false);
+    }, 8500); // 1500ms delay + 7000ms visible = 8500ms total
+
     return () => {
       clearTimeout(timer);
+      clearTimeout(hideTimer);
     };
   }, []);
 
   return (
     <div
-      className={`fixed top-20 right-2 z-[60] transition-all duration-500 ease-out p-2 ${
+      className={`fixed top-20 right-2 z-[60] transition-all duration-300 ease-out max-sm:mx-3 ${
         isVisible
-          ? "translate-x-0 opacity-100"
-          : "translate-x-full opacity-0"
+          ? "translate-x-0 max-sm:translate-x-0 max-sm:translate-y-0 opacity-100"
+          : "translate-x-full max-sm:translate-x-0 max-sm:-translate-y-full opacity-0"
       }`}
     >
       {/* macOS notification container - glass effect */}
-      <div className="bg-black/20 backdrop-blur-3xl rounded-xl shadow-2xl w-96 overflow-hidden border border-white/10 ring-1 ring-black/5">
+      <div className="bg-black/40 backdrop-blur-3xl rounded-2xl shadow-2xl w-96 max-sm:w-full overflow-hidden border border-white/10 ring-1 ring-black/5">
         {/* Main content */}
-        <div className="px-4 pb-4 pt-4">
+        <div className="px-4 pb-3 pt-3">
           <div className="flex items-center gap-3">
             {/* Gmail logo */}
-            <div className="w-16 h-16 bg-white rounded-full flex items-center justify-center flex-shrink-0 shadow-sm">
+            <div className="w-12 h-12 bg-white rounded-full flex items-center justify-center flex-shrink-0 shadow-sm">
               <img 
                 src="/gmail-icon.png" 
                 alt="Gmail"
-                className="w-12 h-12 object-contain"
+                className="w-8 h-8 object-contain"
               />
             </div>
             
             {/* Email content */}
             <div className="flex-1 min-w-0">
-              <div className="mb-1">
-                <span className="text-white font-medium text-sm">What has been done this week?</span>
+              <div className="mb-0.5">
+                <span className="text-white font-medium text-sm">What have you done this week?</span>
               </div>
               
-              <p className="text-white/80 text-sm leading-relaxed">
-                Hi, I'm your manager. It's time for portion of annoying questions about your work that has been done, or avoid this shit and use AsyncStatus.
+              <p className="text-white/80 text-sm leading-snug">
+              Manager here. It's time for the annoying progress status questions, or avoid this shit and use AsyncStatus.
               </p>
             </div>
           </div>

From caf2e7d8f8e081c7b06c33f1412351b7779e33f7 Mon Sep 17 00:00:00 2001
From: Tobiasz Gleba <tobiasz.gleba24@gmail.com>
Date: Fri, 22 Aug 2025 17:51:33 +0200
Subject: [PATCH 3/4] style: enhance Gmail notification with Apple-inspired
 design elements

---
 .../src/app/components/gmail-notification.tsx    | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/apps/marketing-app/src/app/components/gmail-notification.tsx b/apps/marketing-app/src/app/components/gmail-notification.tsx
index 1660ff80..351c4a7c 100644
--- a/apps/marketing-app/src/app/components/gmail-notification.tsx
+++ b/apps/marketing-app/src/app/components/gmail-notification.tsx
@@ -30,13 +30,17 @@ export function GmailNotification() {
           : "translate-x-full max-sm:translate-x-0 max-sm:-translate-y-full opacity-0"
       }`}
     >
-      {/* macOS notification container - glass effect */}
-      <div className="bg-black/40 backdrop-blur-3xl rounded-2xl shadow-2xl w-96 max-sm:w-full overflow-hidden border border-white/10 ring-1 ring-black/5">
+      {/* macOS notification container - glass effect with Apple-inspired squircle */}
+      <div className="bg-white/20 dark:bg-black/40 backdrop-blur-3xl shadow-2xl w-96 max-sm:w-full overflow-hidden border border-white/20 dark:border-white/10 ring-1 ring-black/5" style={{ 
+        borderRadius: '28px 28px 28px 28px / 20px 20px 20px 20px'
+      }}>
         {/* Main content */}
         <div className="px-4 pb-3 pt-3">
           <div className="flex items-center gap-3">
-            {/* Gmail logo */}
-            <div className="w-12 h-12 bg-white rounded-full flex items-center justify-center flex-shrink-0 shadow-sm">
+            {/* Gmail logo with Apple-inspired squircle */}
+            <div className="w-12 h-12 bg-white dark:bg-gray-800 flex items-center justify-center flex-shrink-0 shadow-sm" style={{ 
+              borderRadius: '16px 16px 16px 16px / 12px 12px 12px 12px'
+            }}>
               <img 
                 src="/gmail-icon.png" 
                 alt="Gmail"
@@ -47,10 +51,10 @@ export function GmailNotification() {
             {/* Email content */}
             <div className="flex-1 min-w-0">
               <div className="mb-0.5">
-                <span className="text-white font-medium text-sm">What have you done this week?</span>
+                <span className="text-black dark:text-white font-medium text-sm">What have you done this week?</span>
               </div>
               
-              <p className="text-white/80 text-sm leading-snug">
+              <p className="text-black/80 dark:text-white/80 text-sm leading-snug">
               Manager here. It's time for the annoying progress status questions, or avoid this shit and use AsyncStatus.
               </p>
             </div>

From 62966cd47f5a38f00a2f5a373f0f7261b1e441a3 Mon Sep 17 00:00:00 2001
From: Tobiasz Gleba <tobiasz.gleba24@gmail.com>
Date: Fri, 22 Aug 2025 18:27:42 +0200
Subject: [PATCH 4/4] style: refine border radius for Gmail notification
 component

---
 apps/marketing-app/src/app/components/gmail-notification.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/marketing-app/src/app/components/gmail-notification.tsx b/apps/marketing-app/src/app/components/gmail-notification.tsx
index 351c4a7c..3691e1b5 100644
--- a/apps/marketing-app/src/app/components/gmail-notification.tsx
+++ b/apps/marketing-app/src/app/components/gmail-notification.tsx
@@ -32,14 +32,14 @@ export function GmailNotification() {
     >
       {/* macOS notification container - glass effect with Apple-inspired squircle */}
       <div className="bg-white/20 dark:bg-black/40 backdrop-blur-3xl shadow-2xl w-96 max-sm:w-full overflow-hidden border border-white/20 dark:border-white/10 ring-1 ring-black/5" style={{ 
-        borderRadius: '28px 28px 28px 28px / 20px 20px 20px 20px'
+        borderRadius: '24px'
       }}>
         {/* Main content */}
         <div className="px-4 pb-3 pt-3">
           <div className="flex items-center gap-3">
             {/* Gmail logo with Apple-inspired squircle */}
             <div className="w-12 h-12 bg-white dark:bg-gray-800 flex items-center justify-center flex-shrink-0 shadow-sm" style={{ 
-              borderRadius: '16px 16px 16px 16px / 12px 12px 12px 12px'
+              borderRadius: '14px'
             }}>
               <img 
                 src="/gmail-icon.png"