Skip to content

Commit c92a183

Browse files
committed
Add course author messageg
1 parent ca7888a commit c92a183

File tree

5 files changed

+53
-5
lines changed

5 files changed

+53
-5
lines changed
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import { QuoteIcon } from 'lucide-react';
2+
3+
export function AuthorQuoteMessage() {
4+
return (
5+
<div className="mx-auto mt-14 max-w-2xl sm:mt-20">
6+
<div className="relative overflow-hidden rounded-2xl bg-gradient-to-br from-yellow-500/10 via-yellow-400/5 to-yellow-300/10 p-6 sm:p-10">
7+
{/* Decorative quote mark */}
8+
<div className="absolute left-4 top-4 font-serif text-8xl text-yellow-500/10 sm:block hidden">
9+
<QuoteIcon className="scale-x-[-1] fill-current" />
10+
</div>
11+
12+
<div className="relative">
13+
<p className="mb-6 text-base sm:text-xl leading-relaxed text-zinc-200">
14+
As someone who has worked extensively with databases throughout my
15+
career, I know firsthand how crucial SQL skills are. I've created
16+
this course to share the practical knowledge that has helped me
17+
build and scale data systems at various companies.
18+
</p>
19+
20+
<div className="flex items-center gap-4 border-t border-yellow-500/20 pt-6">
21+
<img
22+
src="https://assets.roadmap.sh/guest/kamran-lqjta.jpeg"
23+
alt="Kamran Ahmed"
24+
className="size-14 rounded-full ring-2 ring-yellow-500/20"
25+
/>
26+
<div>
27+
<h3 className="font-medium text-yellow-500">Kamran Ahmed</h3>
28+
<p className="text-sm text-zinc-400">
29+
Founder roadmap.sh <span className="mx-1 sm:inline hidden">·</span>
30+
<a
31+
href="https://twitter.com/kamrify"
32+
target="_blank"
33+
rel="noopener noreferrer"
34+
className="ml-0.5 text-yellow-500/80 underline underline-offset-4 hover:text-yellow-500"
35+
>
36+
@kamrify
37+
</a>
38+
</p>
39+
</div>
40+
</div>
41+
</div>
42+
</div>
43+
</div>
44+
);
45+
}

src/components/SQLCourse/BuyButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -199,7 +199,7 @@ export function BuyButton(props: BuyButtonProps) {
199199
)}
200200
</button>
201201

202-
{!isLoadingPricing && !isAlreadyEnrolled && (
202+
{!isLoadingPricing && (
203203
<span className="absolute top-full translate-y-2.5 text-sm text-yellow-400">
204204
Lifetime access <span className="mx-1">&middot;</span> Free updates
205205
</span>

src/components/SQLCourse/CourseAuthor.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@ export function CourseAuthor() {
33
<div className="mt-8 w-full max-w-3xl space-y-4">
44
<div className="flex flex-row items-center gap-5">
55
<img
6-
src="https://github.com/kamranahmedse.png"
6+
src="https://assets.roadmap.sh/guest/kamran-lqjta.jpeg"
77
className="size-12 rounded-full bg-yellow-500/10 md:size-16"
8+
alt="Kamran Ahmed"
89
/>
910
<a
1011
href="https://twitter.com/kamrify"

src/components/SQLCourse/PlatformDemo.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export function PlatformDemo() {
3333
src="https://assets.roadmap.sh/guest/course-environment-87jg8.png"
3434
alt="Course Environment"
3535
onClick={() => setIsZoomed(true)}
36-
className="mt-20 w-full max-w-5xl rounded-xl cursor-zoom-in"
36+
className="mt-12 sm:mt-20 w-full max-w-5xl rounded-xl cursor-zoom-in"
3737
/>
3838
</>
3939
);

src/components/SQLCourse/SQLCoursePage.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ import { BuyButton } from './BuyButton';
2626
import { AccountButton } from './AccountButton';
2727
import { RoadmapLogoIcon } from '../ReactIcons/RoadmapLogo';
2828
import { PlatformDemo } from './PlatformDemo';
29-
29+
import { AuthorQuoteMessage } from './AuthorQuoteMessage';
3030
type ChapterData = {
3131
icon: React.ReactNode;
3232
title: string;
@@ -243,7 +243,7 @@ export function SQLCoursePage() {
243243
];
244244

245245
return (
246-
<div className="flex flex-grow flex-col items-center bg-gradient-to-b from-zinc-900 to-zinc-950 px-4 pb-52 pt-3 text-zinc-400 md:px-10 md:pt-8">
246+
<div className="relative flex flex-grow flex-col items-center bg-gradient-to-b from-zinc-900 to-zinc-950 px-4 pb-52 pt-3 text-zinc-400 md:px-10 md:pt-8">
247247
<div className="flex w-full items-center justify-between">
248248
<a
249249
href="https://roadmap.sh"
@@ -299,6 +299,8 @@ export function SQLCoursePage() {
299299
</div>
300300
</div>
301301

302+
<AuthorQuoteMessage />
303+
302304
<PlatformDemo />
303305

304306
<SectionHeader

0 commit comments

Comments
 (0)