From 98141e931b239f966c0f68f17f39e4364fd9cb82 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Casal?= <andre@andrecasal.com>
Date: Tue, 3 Sep 2024 10:01:13 +0100
Subject: [PATCH] upgrade landing page

---
 app/routes/_marketing+/components/brands.tsx  |  2 +-
 .../_marketing+/components/hero-andre.tsx     | 18 ++++----
 app/routes/_marketing+/index.tsx              | 42 ++++++++-----------
 package-lock.json                             |  6 +--
 4 files changed, 31 insertions(+), 37 deletions(-)

diff --git a/app/routes/_marketing+/components/brands.tsx b/app/routes/_marketing+/components/brands.tsx
index d1fc7a9..4d26d7d 100644
--- a/app/routes/_marketing+/components/brands.tsx
+++ b/app/routes/_marketing+/components/brands.tsx
@@ -7,7 +7,7 @@ import { H2 } from '~/ui_components/typography/h2.tsx'
 const Brands = () => {
 	return (
 		<>
-			<Container>
+			<Container className="mt-32">
 				<H2 size="3xl" align="center">
 					Brands
 				</H2>
diff --git a/app/routes/_marketing+/components/hero-andre.tsx b/app/routes/_marketing+/components/hero-andre.tsx
index 4239b1b..ddaf05e 100644
--- a/app/routes/_marketing+/components/hero-andre.tsx
+++ b/app/routes/_marketing+/components/hero-andre.tsx
@@ -9,24 +9,24 @@ import { P } from '~/ui_components/typography/p.tsx'
 const HeroAndre = () => {
 	return (
 		<BackgroundDiagonal>
-			<Container className="py-32 sm:py-40">
-				<div className="lg:grid lg:grid-cols-2 lg:gap-x-10">
-					<div className="mx-auto max-w-2xl lg:mx-0">
-						<Link to="/ui" className="inline-flex flex-wrap gap-6">
+			<Container className="">
+				<div className="md:grid md:grid-cols-2 space-y-10">
+					<div className="mx-auto max-w-2xl">
+						<a href="https://launchfast.pro" target="_blank" className="inline-flex flex-wrap gap-6" rel="noreferrer">
 							<Badge variant="info" size="md" className="whitespace-nowrap">
 								What's new
 							</Badge>
 							<P size="sm" className="inline-flex items-center space-x-2 whitespace-nowrap font-medium text-muted-600">
-								Building a React ⚛️ UI library
+								Launched LaunchFast.pro 🎉
 							</P>
-						</Link>
+						</a>
 						<H1 size="4xl" className="mt-10">
 							Hi! I'm André Casal.
 						</H1>
 						<P size="lg" className="mt-6 text-muted-700">
 							I'm a tech entrepreneur that loves to build stuff.
 						</P>
-						<div className="mt-10 flex items-center gap-x-6">
+						<div className="mt-10 flex flex-wrap items-center justify-center gap-6">
 							<Link
 								to="#built"
 								className="inline-flex h-14 items-center justify-center whitespace-nowrap rounded-md border bg-muted-50 px-10 text-size-md font-semibold text-muted-800 ring-offset-background transition-colors hover:bg-muted-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
@@ -38,8 +38,8 @@ const HeroAndre = () => {
 							</Button>
 						</div>
 					</div>
-					<div className="mt-16 sm:mt-24 lg:mt-0">
-						<img src="/img/andre.jpg" alt="André Casal" height="100px" className="aspect-[6/5] rounded-2xl object-cover" />
+					<div className="flex justify-center">
+						<img src="/img/andre_casal.png" alt="André Casal" className="aspect-square w-1/2 md:w-3/4 rounded-2xl object-contain" />
 					</div>
 				</div>
 			</Container>
diff --git a/app/routes/_marketing+/index.tsx b/app/routes/_marketing+/index.tsx
index 97ab2bb..e4b414a 100644
--- a/app/routes/_marketing+/index.tsx
+++ b/app/routes/_marketing+/index.tsx
@@ -17,10 +17,17 @@ export const links: LinksFunction = () => {
 export default function Index() {
 	const successful_businesses = [
 		{
-			name: 'Tutoring',
-			description: 'Tutoring college students on Computer Science. Algebra, Calculus, Digital Systems, Computer Architecture, Programming, Data Structures, Algorithms, and more.',
-			icon: 'academic-cap',
-			link: '/tutoring',
+			name: 'LaunchFast.pro',
+			description: 'One command to a fully featured, secure, production-ready app.',
+			icon: 'rocket',
+			link: 'https://launchfast.pro',
+			external: true,
+		},
+		{
+			name: 'Newsletter & Articles',
+			description: 'Golden nuggets of (usually technical) knowledge you can read in 5 minutes. Delivered to your inbox every 2 weeks.',
+			icon: 'file-text',
+			link: '/articles',
 		},
 		{
 			name: 'Mentoring',
@@ -28,16 +35,15 @@ export default function Index() {
 			icon: 'chat-bubble-left-right',
 			link: '/mentorship',
 		},
+		{
+			name: 'Tutoring',
+			description: 'Tutoring college students on Computer Science. Algebra, Calculus, Digital Systems, Computer Architecture, Programming, Data Structures, Algorithms, and more.',
+			icon: 'academic-cap',
+			link: '/tutoring',
+		},
 	]
 
 	const currently_building = [
-		{
-			name: 'LaunchFast',
-			description: 'The Remix stack with all you need to build your web app. From idea to production in 2 minutes.',
-			icon: 'bolt',
-			link: 'https://launchfast.pro',
-			external: true,
-		},
 		{
 			name: 'VerveUI',
 			description: 'All the lego pieces to build your UI. An accessible, SEO-optimized, UI library for fast UI development.',
@@ -45,18 +51,6 @@ export default function Index() {
 			link: 'https://verveui.pro',
 			external: true,
 		},
-		{
-			name: 'Estuda Comigo',
-			description: 'Platform for Portuguese students to find the best tutors.',
-			icon: 'estuda-comigo',
-			link: 'https://www.estuda-comigo.com/',
-		},
-		{
-			name: 'Newsletter & Articles',
-			description: 'Golden nuggets of (usually technical) knowledge you can read in 5 minutes. Delivered to your inbox every 2 weeks.',
-			icon: 'file-text',
-			link: '/articles',
-		},
 	]
 
 	return (
@@ -67,7 +61,7 @@ export default function Index() {
 				<div className="py-24 sm:py-32">
 					<div className="mx-auto max-w-2xl lg:text-center">
 						<H2 size="3xl" align="center" className="mt-4 font-bold">
-							<span className="inline-block -rotate-1 px-2 font-bold text-brand">Successfull</span> businesses
+							<span className="inline-block -rotate-1 px-2 font-bold text-brand">Stuff I've built</span>
 						</H2>
 					</div>
 					<div className="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-4xl">
diff --git a/package-lock.json b/package-lock.json
index 7ecaea4..9047c7e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8399,9 +8399,9 @@
 			}
 		},
 		"node_modules/caniuse-lite": {
-			"version": "1.0.30001576",
-			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001576.tgz",
-			"integrity": "sha512-ff5BdakGe2P3SQsMsiqmt1Lc8221NR1VzHj5jXN5vBny9A6fpze94HiVV/n7XRosOlsShJcvMv5mdnpjOGCEgg==",
+			"version": "1.0.30001655",
+			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001655.tgz",
+			"integrity": "sha512-jRGVy3iSGO5Uutn2owlb5gR6qsGngTw9ZTb4ali9f3glshcNmJ2noam4Mo9zia5P9Dk3jNNydy7vQjuE5dQmfg==",
 			"funding": [
 				{
 					"type": "opencollective",