Skip to content

Commit 25244ea

Browse files
Merge pull request #154 from Satyam-Trivedi-ZS/Reviews
Added testimonials section
2 parents 0abb704 + 59b4e58 commit 25244ea

File tree

4 files changed

+133
-5
lines changed

4 files changed

+133
-5
lines changed

src/components/DBlistComponent.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ const DBlistComponent = () => {
6262
<div className="bg-gray-900 py-10">
6363
<div className="mx-auto max-w-screen-2xl lg:px-8 xl:px-12">
6464
<div className="mx-auto max-w-2xl lg:max-w-none">
65-
<h2 className="text-center text-lg font-semibold leading-8 text-slate-400">
65+
<h2 className="text-center text-lg font-semibold leading-8 text-white">
6666
Built-in support for popular databases and messaging systems
6767
</h2>
6868
<div className="wrapper mx-auto mt-10 flex items-start ">

src/components/HomePage.jsx

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,12 @@
22
import CompanyList from './CompanyTrustedList'
33
import DBlistComponent from './DBlistComponent'
44
import { Hero } from './Hero'
5-
import { Testimonials } from './Testimonials'
5+
// import { Testimonials } from './Testimonials'
66
import { QuickLink } from '@/components/QuickLinks'
7+
import blurCyanImage from "@/images/blur-cyan.png";
8+
import Image from "next/image";
9+
import React from "react";
10+
import Testimonials from "@/components/Reviews";
711
export function HomePage() {
812
return (
913
<div className="m-auto w-auto max-w-screen-2xl">
@@ -41,10 +45,19 @@ export function HomePage() {
4145
icon="crash"
4246
/>
4347
</div>
48+
<Image
49+
className="absolute opacity-25"
50+
src={blurCyanImage}
51+
alt=""
52+
width={'h-44'}
53+
unoptimized
54+
priority
55+
/>
4456
<DBlistComponent />
45-
<div className="mx-4 flex flex-col {{ sm:flex-col xs:flex-col md:flex-row lg:flex-row }} gap-x-8 overflow-y-auto pb-10 gap-y-16 lg:mx-8 xl:mx-12 xl:gap-x-16">
46-
<Testimonials />
47-
</div>
57+
{/*<div className="mx-4 flex flex-col {{ sm:flex-col xs:flex-col md:flex-row lg:flex-row }} gap-x-8 overflow-y-auto pb-10 gap-y-16 lg:mx-8 xl:mx-12 xl:gap-x-16">*/}
58+
{/* <Testimonials />*/}
59+
{/*</div>*/}
60+
<Testimonials/>
4861
</div>
4962
)
5063
}

src/components/Reviews.jsx

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import Image from "next/image";
2+
import React from "react";
3+
import testimonials from 'utils/testimonials.json'
4+
5+
6+
export default function Testimonials() {
7+
return (
8+
<div className="mx-10 min-h-screen bg-[#101827]">
9+
{/*<h2 className="text-center text-lg font-semibold leading-8 text-white mb-10">*/}
10+
{/* User Testimonials*/}
11+
{/*</h2>*/}
12+
<div className="md:columns-3">
13+
{testimonials.map((testimonial, index) => (
14+
<div key={index} className="group inline-block relative my-3 rounded-xl border cursor-default border-slate-200 dark:border-slate-800 p-1">
15+
<div className="absolute -inset-px rounded-xl border-2 border-transparent opacity-0 [background:linear-gradient(var(--quick-links-hover-bg,theme(colors.sky.50)),var(--quick-links-hover-bg,theme(colors.sky.50)))_padding-box,linear-gradient(to_top,theme(colors.indigo.400),theme(colors.cyan.400),theme(colors.sky.500))_border-box] group-hover:opacity-100 dark:[--quick-links-hover-bg:theme(colors.slate.800)]" />
16+
17+
<div className="relative overflow-hidden rounded-xl p-6">
18+
<div className="scrollbar-thin scrollbar-thumb-gray-500 max-h-[290px] overflow-y-auto pr-2">
19+
<p className="mt-1 text-sm text-slate-700 dark:text-slate-400">
20+
"{testimonial?.quote}"
21+
</p>
22+
</div>
23+
24+
<div
25+
className="mt-2 flex items-center justify-between border-t border-slate-200 dark:border-slate-800 pt-3">
26+
<div className="flex items-center justify-center gap-3">
27+
{testimonial?.profile ? (
28+
<Image
29+
className="h-14 w-14 rounded-full bg-gray-800"
30+
src={testimonial?.profile}
31+
width={400}
32+
height={400}
33+
alt="profile"
34+
unoptimized
35+
/>
36+
) : (
37+
<div className="h-14 w-14 flex items-center justify-center rounded-full bg-gray-500 text-white text-2xl font-semibold">
38+
{testimonial?.author.charAt(0)}
39+
</div>
40+
)}
41+
42+
{/*<div className="h-10 w-10 rounded-full bg-gray-300"></div>*/}
43+
<div>
44+
<p className="font-medium text-slate-900 dark:text-white">
45+
{testimonial?.author}
46+
</p>
47+
<p className="text-sm text-slate-700 dark:text-slate-400">
48+
{testimonial?.role}
49+
</p>
50+
</div>
51+
</div>
52+
<button
53+
className="rounded-md">
54+
{/*className="rounded-md bg-slate-200 dark:bg-slate-700 px-4 py-1 text-sm text-slate-900 dark:text-white transition hover:bg-slate-300 dark:hover:bg-slate-600">*/}
55+
{testimonial?.logo ? (
56+
<img src={testimonial?.logo} alt="Logo" className="h-6 w-6 object-contain"/>
57+
) : (
58+
''
59+
)}
60+
</button>
61+
62+
</div>
63+
</div>
64+
</div>
65+
))}
66+
67+
68+
</div>
69+
</div>
70+
)
71+
}
72+

utils/testimonials.json

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
[
2+
{
3+
"quote": "What I like about GoFr is that it plays well with the standard CI/CD infrastructure, deployment environment, and every additional tool in between. Also, it solves for the 80% cases, thus, ensuring we only focus on our core business",
4+
"author": "Praveen Kumar",
5+
"role": "Founder of apnerve labs",
6+
"profile": "https://randomuser.me/api/portraits/men/1.jpg"
7+
},
8+
{
9+
"quote": "The strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-tryThe strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-tryThe strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-tryThe strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-tryThe strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-try",
10+
"author": "Praveen Kumar",
11+
"role": "Founder of apnerve labs",
12+
"profile": "https://randomuser.me/api/portraits/men/2.jpg",
13+
"logo": "https://randomuser.me/api/portraits/men/1.jpg"
14+
},
15+
{
16+
"quote": "What I like about GoFr is that it plays well with the standard CI/CD infrastructure, deployment environment, and every additional to'What I like about GoFr is that it plays well with the standard CI/CD infrastructure, deployment environment, and every additional tool in between. Also, it solves for the 80% cases, thus, ensuring we only focus on our core business'ol in between. Also, it solves for the 80% cases, thus, ensuring we only focus on our core business",
17+
"author": "Praveen Kumar",
18+
"role": "Founder of apnerve labs",
19+
"profile": "https://randomuser.me/api/portraits/women/1.jpg",
20+
"logo": "https://randomuser.me/api/portraits/men/1.jpg"
21+
},
22+
{
23+
"quote": "What I like about GoFr is that it plays well with the standard CI/CD infrastructure, deployment environment, and every additional tool in between. Also, it solves for the 80% cases, thus, ensuring we only focus on our core business",
24+
"author": "Praveen Kumar",
25+
"role": "Founder of apnerve labs",
26+
"profile": "https://randomuser.me/api/portraits/men/3.jpg",
27+
"logo": "https://randomuser.me/api/portraits/men/1.jpg"
28+
},
29+
{
30+
"quote": "What I like about GoFr is that it plays well with the standard CI/CD infrastructure, deployment environment, and every additional tool in between. Also, it solves for the 80% cases, thus, ensuring we only focus on our core business",
31+
"author": "Praveen Kumar",
32+
"role": "Founder of apnerve labs",
33+
"profile": "https://randomuser.me/api/portraits/women/2.jpg",
34+
"logo": "https://randomuser.me/api/portraits/men/1.jpg"
35+
},
36+
{
37+
"quote": "The strong opinions embedded in GoFr.dev make it incredibly efficient and straightforward to work with. It's like having a trusted expert guiding your every move. The framework's Golang foundation ensures exceptional performance and reliability. If you're serious about microservices, this is a must-try",
38+
"author": "Praveen Kumar",
39+
"role": "Founder of apnerve labs",
40+
"profile": "https://randomuser.me/api/portraits/men/4.jpg",
41+
"logo": "https://randomuser.me/api/portraits/men/1.jpg"
42+
}
43+
]

0 commit comments

Comments
 (0)