feat(mkt): update sections

sweetr-dev · Dec 19, 2024 · ce7a4ba · ce7a4ba
1 parent 6f8a7e8
commit ce7a4ba
Show file tree

Hide file tree

Showing 10 changed files with 159 additions and 89 deletions.
diff --git a/apps/docs/about/open-source.mdx b/apps/docs/about/open-source.mdx
@@ -13,4 +13,4 @@ We believe this license strikes a good balance between freedom for our users and
 
 ## Contributing
 
-We love open source and are dedicated to fostering a collaborative environment. Contributions from the community are invaluable to us, and we welcome any input, whether it’s bug fixes, new features, or improvements to documentation. By working together, we can continue to innovate and create tools that benefit everyone.
+Contributions from the community are invaluable to us, and we welcome any input, whether it’s bug fixes, new features, or improvements to documentation.
diff --git a/apps/docs/about/principles.mdx b/apps/docs/about/principles.mdx
@@ -21,21 +21,11 @@ Our mission is to empower developers with tools that enhance productivity, well-
   <Card title="Simple and effective" icon="crosshairs">
     Our commitment is to deliver solutions that are both powerful and easy to
     use. We design our tools with simplicity in mind, ensuring they are
-    intuitive and user-friendly. By focusing on essential features and
-    minimizing unnecessary complexity, we empower our users to drive their
-    teams' success efficiently and effectively.
-  </Card>
-  <Card title="Transparency and Trust" icon="shield">
-    We believe in open communication and honesty. Our processes, decisions, and
-    code are open for scrutiny, fostering trust within our community and among
-    our users. Additionally, all data visible to a manager is also accessible to
-    developers, ensuring transparency and preventing data silos. This openness
-    helps build a collaborative environment where trust and accountability are
-    paramount.
+    intuitive and user-friendly.
   </Card>
   <Card title="Community-Driven" icon="users">
     Our community is at the heart of everything we do. We actively seek out and
-    incorporate community feedback, and we support open-source initiatives that
-    benefit the wider developer ecosystem.
+    incorporate community feedback, and we know that's how we build a winning
+    product.
   </Card>
 </CardGroup>
diff --git a/apps/docs/features/integrations.mdx b/apps/docs/features/integrations.mdx
@@ -0,0 +1,27 @@
+---
+title: Integrations
+description: The tools we integrate with.
+icon: "grid-2-plus"
+---
+
+import { CtaGetStarted } from "/snippets/cta-get-started.mdx";
+
+## Available today
+
+<CardGroup cols={2}>
+  <Card title="🟢 Slack" />
+  <Card title="🟢 GitHub" />
+</CardGroup>
+
+## Coming soon
+
+<CardGroup cols={2}>
+  <Card title="🔜 Teams" />
+  <Card title="🔜 PagerDuty" />
+  <Card title="🔜 Jira" />
+  <Card title="🔜 Linear" />
+  <Card title="🔜 GitLab" />
+  <Card title="🔜 BitBucket" />
+</CardGroup>
+
+<CtaGetStarted />
diff --git a/apps/docs/get-started/intro.mdx b/apps/docs/get-started/intro.mdx
@@ -1,9 +1,17 @@
 ---
 title: Intro
-description: "Welcome to sweetr.dev, the dev-first platform for continuous improvement."
+description: "Welcome to sweetr.dev, the developer platform for continuous improvement."
 icon: "hand-wave"
 ---
 
+**What problems does it solve?**  
+Sweetr tries to solve several of problems that affect **productivity** and **developer experience**, like big PRs, slow code reviews, unfair performance reviews, and so forth.
+
+Explore the features section to learn how each tool can help your team.
+
+**Who is it for?**  
+For leaders, managers and developers of teams of all sizes.
+
 #### Get Started
 
 <CardGroup cols={2}>
@@ -25,5 +33,6 @@ icon: "hand-wave"
     icon="chart-simple"
     href="/features/team/code-review-distribution"
   />
+  <Card title="Digests" icon="newspaper" href="/features/digests" />
   <Card title="Automations" icon="robot" href="/features/automations/intro" />
 </CardGroup>
diff --git a/apps/docs/mint.json b/apps/docs/mint.json
@@ -87,7 +87,8 @@
             "features/automations/pr-size-labeler",
             "features/automations/pr-title-check"
           ]
-        }
+        },
+        "features/integrations"
       ]
     },
     {

diff --git a/apps/mkt/app/layout.tsx b/apps/mkt/app/layout.tsx
@@ -22,9 +22,9 @@ const inter_tight = Inter_Tight({
 export const metadata: Metadata = {
   title: "sweetr.dev",
   description:
-    "The dev-first platform for continuous improvement. Enable your software engineering teams to optimize and speed up development while improving developer experience.",
+    "The developer platform for continuous improvement. Enable your software engineering teams to optimize and speed up development while improving developer experience.",
   openGraph: {
-    title: "Sweetr - The dev-first platform for continuous improvement",
+    title: "Sweetr - The developer platform for continuous improvement",
     description:
       "Enable your software engineering teams to optimize and speed up development while improving developer experience. Self-host for free or try a 14-day trial.",
     url: "https://sweetr.dev",
@@ -43,7 +43,7 @@ export const metadata: Metadata = {
   twitter: {
     card: "summary_large_image",
     title: "sweetr.dev",
-    description: "The dev-first platform for continuous improvement",
+    description: "The developer platform for continuous improvement",
     images: ["https://sweetr.dev/images/og-image.png"],
   },
 };

diff --git a/apps/mkt/components/features-overview.tsx b/apps/mkt/components/features-overview.tsx
@@ -130,14 +130,16 @@ export default function FeaturesOverview() {
       <div className="py-12 md:py-20">
         {/* Carousel */}
         <div className="max-w-xl lg:max-w-6xl mx-auto px-4 sm:px-6 md:px-0">
-          <div className="relative max-w-3xl mx-auto text-center pb-12 md:pb-12">
-            <h2 className="font-inter-tight text-3xl md:text-4xl font-bold text-white mb-4">
-              Meet the solution
-            </h2>
-            <h3 className="text-lg text-green-400">
-              Unlock continuous improvement with team-focused data, insights &
-              automations.
-            </h3>
+          <div className="max-w-xl lg:max-w-6xl mx-auto px-4 sm:px-6 md:px-0">
+            <div className="relative mx-auto pb-12 md:pb-20">
+              <h2 className="font-inter-tight text-3xl md:text-4xl font-bold text-white mb-4">
+                Your pathway to engineering excellence
+              </h2>{" "}
+              <div className="text-lg text-green-400 max-w-2xl">
+                Unlock continuous improvement with team-focused data, insights &
+                automations.
+              </div>
+            </div>
           </div>
 
           <div className="lg:flex space-y-12 lg:space-y-0 lg:space-x-12 xl:space-x-12">

diff --git a/apps/mkt/components/hero-video.tsx b/apps/mkt/components/hero-video.tsx
@@ -13,11 +13,14 @@ import Image8 from "@/public/images/hero/8-sweetr-teamc-deo-review-distribution-
 import Image9 from "@/public/images/hero/9-sweetr-people-directory.png";
 import Image10 from "@/public/images/hero/10-sweetr-person-code-reviews.png";
 import {
+  IconBrandGithub,
   IconChevronLeft,
   IconChevronRight,
   IconInfoCircle,
+  IconLock,
   IconPlayerPause,
   IconPlayerPlay,
+  IconServer,
 } from "@tabler/icons-react";
 
 export const HeroVideo = () => {
@@ -102,20 +105,45 @@ export const HeroVideo = () => {
 
   return (
     <>
-      <div className="hidden md:flex justify-end gap-1 text-dark-100 mb-1">
-        <button onClick={handleAutoPlay} aria-label="Auto-play Slider">
-          {isAutoPlaying ? (
-            <IconPlayerPause stroke={1.5} size={20} />
-          ) : (
-            <IconPlayerPlay stroke={1.5} size={20} />
-          )}
-        </button>
-        <button onClick={handlePrevious} aria-label="Previous Slide">
-          <IconChevronLeft stroke={1.5} size={20} />
-        </button>
-        <button onClick={handleNext} aria-label="Next Slide">
-          <IconChevronRight stroke={1.5} size={20} />
-        </button>
+      <div className="flex justify-between gap-1 text-dark-100 mb-1">
+        <div></div>
+        <div>
+          <div className="text-dark-200 text-sm">
+            <div className="flex justify-center gap-2">
+              <div className="flex gap-1 items-center">
+                <IconLock size={14} />
+                100% secure
+              </div>
+              <div>•</div>
+              <div className="flex gap-1 items-center">
+                <IconServer size={14} />
+                self host for free
+              </div>
+              <div className="hidden md:block">•</div>
+              <div className="hidden md:flex gap-1 items-center">
+                <IconBrandGithub size={14} />
+                source code available
+              </div>
+            </div>
+          </div>
+        </div>
+        <div>
+          <div className="hidden md:block">
+            <button onClick={handleAutoPlay} aria-label="Auto-play Slider">
+              {isAutoPlaying ? (
+                <IconPlayerPause stroke={1.5} size={20} />
+              ) : (
+                <IconPlayerPlay stroke={1.5} size={20} />
+              )}
+            </button>
+            <button onClick={handlePrevious} aria-label="Previous Slide">
+              <IconChevronLeft stroke={1.5} size={20} />
+            </button>
+            <button onClick={handleNext} aria-label="Next Slide">
+              <IconChevronRight stroke={1.5} size={20} />
+            </button>
+          </div>
+        </div>
       </div>
       <div className="block relative ease-out duration-300">
         {/* hover:scale-105 cursor-pointer */}

diff --git a/apps/mkt/components/hero.tsx b/apps/mkt/components/hero.tsx
@@ -2,6 +2,13 @@ import Link from "next/link";
 import { HeroVideo } from "./hero-video";
 import Image from "next/image";
 import Particles from "./automation-carousel/particles";
+import {
+  IconBook,
+  IconBrandGithub,
+  IconCloud,
+  IconLock,
+  IconServer,
+} from "@tabler/icons-react";
 
 export default async function Hero() {
   const repo = "sweetr-dev/sweetr.dev";
@@ -27,24 +34,24 @@ export default async function Hero() {
           {/* Section content */}
           <div className="px-4 sm:px-6 md:px-0">
             <div className="mx-auto relative">
-              <div className="text-center pb-12 md:pb-16 z-10">
-                <h1 className="font-inter-tight text-4xl md:text-5xl font-bold bg-clip-text text-transparent text-white pb-4">
-                  The dev-first platform for
+              <div className="text-center pb-4 z-10">
+                <h1 className="font-inter-tight text-4xl md:text-5xl font-bold bg-clip-text text-transparent text-white mb-2">
+                  The developer platform for
                   <em
                     className={`italic flex relative justify-center items-center text-green-400`}
                   >
                     continuous improvement
                   </em>
                 </h1>
                 <div className="max-w-2xl mx-auto">
-                  <h2 className="text-lg text-dark-100 mb-8">
-                    Enable your software engineering teams to optimize and speed
-                    up development while improving developer experience.
+                  <h2 className="text-lg text-dark-100 mb-12">
+                    Enable your development teams to optimize and speed up
+                    development while improving developer experience.
                   </h2>
                 </div>
-                <div className="max-w-xs mx-auto sm:max-w-none sm:inline-flex sm:justify-center space-y-4 sm:space-y-0 sm:space-x-4">
+                <div className="pb-12 md:mb-16 max-w-xs mx-auto sm:max-w-none sm:inline-flex sm:justify-center space-y-4 sm:space-y-0 sm:space-x-4">
                   <div>
-                    <Link
+                    {/* <Link
                       className="btn text-white w-full border-dark-400  shadow-md shadow-[rgba(255,255,255,0.05)]"
                       href={`https://github.com/${repo}`}
                       target="_blank"
@@ -64,14 +71,23 @@ export default async function Hero() {
                           {starsString}
                         </div>
                       )}
+                    </Link> */}
+                    <Link
+                      className="btn text-white w-full bg-dark-800 border-dark-200 shadow-xl shadow-[rgba(255,255,255,0.1)]"
+                      href={`https://docs.sweetr.dev`}
+                      target="_blank"
+                    >
+                      <div className="flex gap-2 items-center">
+                        Read the docs
+                      </div>
                     </Link>
                   </div>
                   <div>
                     <a
-                      className="btn text-green-400  font-semibold border-green-400  w-full shadow-md shadow-green-300/20"
+                      className="btn text-green-400 bg-dark-800 font-semibold border-green-400  w-full shadow-xl shadow-green-300/10"
                       href="#pricing"
                     >
-                      Get started for free
+                      Get started
                     </a>
                   </div>
                 </div>

diff --git a/apps/mkt/components/problem-statements.tsx b/apps/mkt/components/problem-statements.tsx
@@ -1,25 +1,19 @@
-import {
-  IconClipboardData,
-  IconMessageDown,
-  IconMessageExclamation,
-  IconSeeding,
-  IconUserPentagon,
-} from "@tabler/icons-react";
-import { IconEyeClosed, IconCode, IconInfinity } from "@tabler/icons-react";
+import { IconMessageReport } from "@tabler/icons-react";
+import { IconCode, IconInfinity } from "@tabler/icons-react";
 
 export default function ProblemStatements() {
   const challenges = [
-    {
-      icon: (
-        <IconEyeClosed
-          size={64}
-          stroke={0.5}
-          className="text-red-500 mx-auto"
-        />
-      ),
-      title: "Lack of visibility",
-      description: "Scattered data make it hard to measure impact.",
-    },
+    // {
+    //   icon: (
+    //     <IconEyeClosed
+    //       size={64}
+    //       stroke={0.5}
+    //       className="text-red-500 mx-auto"
+    //     />
+    //   ),
+    //   title: "Lack of visibility",
+    //   description: "Scattered data make it hard to measure impact.",
+    // },
     {
       icon: (
         <IconCode size={64} stroke={0.5} className="text-red-500 mx-auto" />
@@ -29,48 +23,51 @@ export default function ProblemStatements() {
     },
     {
       icon: (
-        <IconInfinity size={64} stroke={0.5} className="text-red-500 mx-auto" />
-      ),
-      title: "Low predictability",
-      description: "It's hard to understand the team's flow.",
-    },
-    {
-      icon: (
-        <IconUserPentagon
+        <IconMessageReport
           size={64}
           stroke={0.5}
           className="text-red-500 mx-auto"
         />
       ),
-      title: "Inconsistent feedback",
+      title: "Poor feedback",
       description: "Struggle to coach and mentor the team.",
     },
+    {
+      icon: (
+        <IconInfinity size={64} stroke={0.5} className="text-red-500 mx-auto" />
+      ),
+      title: "Low predictability",
+      description: "Deadlines are often missed.",
+    },
   ];
 
   return (
     <section className=" bg-dark-800 border-t border-dark-400">
-      <div className="py-12 md:py-20">
+      <div className="py-12 md:py-32">
         <div className="max-w-6xl mx-auto px-4 sm:px-6 md:px-0">
-          <div className="relative max-w-3xl mx-auto text-center pb-12 md:pb-12">
+          <div className="relative pb-12 md:pb-12">
             <h2 className="font-inter-tight text-3xl md:text-4xl font-bold text-white mb-4">
-              The problems
+              The success & growth{" "}
+              <em className="border-b-2 border-dashed border-b-red-400 text-red-400">
+                killers
+              </em>
             </h2>
-            <h3 className="text-lg text-red-400">
-              Faced by engineering managers and leadership.
+            <h3 className="text-lg text-dark-100">
+              Faced by engineering leaders and their teams.
             </h3>
           </div>
-          <div className="flex flex-wrap">
+          <div className="flex flex-wrap lg:flex-nowrap gap-4">
             {challenges.map((challenge, index) => (
-              <div key={index} className="w-full md:w-1/2 lg:w-1/2 px-4 mb-8">
+              <div key={index} className="w-full lg:w-1/3">
                 <div
-                  className="py-12 rounded-lg border border-red-400/50 shadow-md text-center bg-dark-900"
+                  className="py-12 rounded-lg border border-red-400/20 shadow-md text-center bg-dark-900"
                   style={{
                     background:
-                      "linear-gradient(151deg, rgba(248,113,113,0.15) 0%, rgba(20,21,23,1) 30%, rgba(20,21,23,1) 70%, rgba(248,113,113,0.15) 100%)",
+                      "linear-gradient(165deg, rgba(248,113,113,0.15) 0%, rgba(20,21,23,1) 30%, rgba(20,21,23,1) 70%, rgba(248,113,113,0.15) 100%)",
                   }}
                 >
                   {challenge.icon}
-                  <h3 className="mt-2 text-xl font-semibold text-black bg-red-400 px-3 inline-block rounded">
+                  <h3 className="mt-4 text-xl font-semibold text-black bg-red-400 px-3 inline-block rounded">
                     {challenge.title}
                   </h3>
                   <p className="mt-4 text-dark-100 px-2">
Original file line number	Diff line number	Diff line change
Expand Up		@@ -13,4 +13,4 @@ We believe this license strikes a good balance between freedom for our users and

		## Contributing

		We love open source and are dedicated to fostering a collaborative environment. Contributions from the community are invaluable to us, and we welcome any input, whether it’s bug fixes, new features, or improvements to documentation. By working together, we can continue to innovate and create tools that benefit everyone.
		Contributions from the community are invaluable to us, and we welcome any input, whether it’s bug fixes, new features, or improvements to documentation.
-Original file line number
+Diff line change
@@ Expand Up / @@ -87,7 +87,8 @@ @@
                 "features/automations/pr-size-labeler",
                 "features/automations/pr-title-check"
               ]
-            }
+            },
+            "features/integrations"
           ]
         },
         {
@@ Expand Down @@