From fc5522d11c3a08d91b8bbe8e6bec8125b9a96833 Mon Sep 17 00:00:00 2001
From: SumantxD <st72365@gmail.com>
Date: Sat, 20 May 2023 10:55:00 -0500
Subject: [PATCH] fix: fixing visibility issue

Signed-off-by: SumantxD <st72365@gmail.com>
---
 components/Carousel.js |  2 +-
 pages/index.js         | 16 ++++++++--------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/components/Carousel.js b/components/Carousel.js
index 325745bb894a..1e89842e3a02 100644
--- a/components/Carousel.js
+++ b/components/Carousel.js
@@ -58,7 +58,7 @@ export default function Carousel({
             index !== current && index < current ? "-translate-x-full" : ""
           } w-full transition-all duration-700`}
         >
-          {!item.video ? item.element : null}
+          {!item.video ? React.cloneElement(item.element, { alt: "Carousel Image" }) : null}
           {index === current && item.video ? item.element : null}
           <div
             className={`${
diff --git a/pages/index.js b/pages/index.js
index e982035ccbba..e7de4e16a592 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -230,7 +230,7 @@ function HomePage() {
               data={[
                   {
                   element: (
-                    <section className="text-gray-600 body-font w-[500px] object-contain mx-auto -mt-12">
+                    <section className="text-gray-800 body-font w-[500px] object-contain mx-auto -mt-12">
                     <div className="container px-5 py-24 mx-auto">
                       <div className="flex flex-wrap -m-4">
                         <div className="mb-6 p-4">
@@ -239,7 +239,7 @@ function HomePage() {
                             <p className="leading-relaxed">Microservices underline the need for event-based communication in distributed architectures. AsyncAPI brings the richness of the REST API ecosystem to asynchronous APIs.</p>
                             <span className="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
                             <h2 className="text-gray-900 font-medium title-font tracking-wider text-sm">Matt McLarty</h2>
-                            <p className="text-gray-500">Global Leader of API Strategy at MuleSoft</p>
+                            <p className="text-gray-700">Global Leader of API Strategy at MuleSoft</p>
                           </div>
                         </div>
                       </div>
@@ -249,7 +249,7 @@ function HomePage() {
                   },
                   {
                     element: (
-                      <section className="text-gray-600 body-font w-[500px] object-contain mx-auto -mt-12">
+                      <section className="text-gray-800 body-font w-[500px] object-contain mx-auto -mt-12">
                       <div className="container px-5 py-24 mx-auto">
                         <div className="flex flex-wrap -m-4">
                           <div className="mb-6 p-4">
@@ -258,7 +258,7 @@ function HomePage() {
                               <p className="leading-relaxed">Event-driven APIs need love too! AsyncAPI brings the many benefits of a machine/human readable specification to these nuanced approaches.</p>
                               <span className="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
                               <h2 className="text-gray-900 font-medium title-font tracking-wider text-sm">Bill Doerrfeld</h2>
-                              <p className="text-gray-500">Editor in Chief at Nordic APIs</p>
+                              <p className="text-gray-700">Editor in Chief at Nordic APIs</p>
                             </div>
                           </div>
                         </div>
@@ -268,7 +268,7 @@ function HomePage() {
                   },
                   {
                   element: (
-                    <section className="text-gray-600 body-font w-[500px] object-contain mx-auto -mt-12">
+                    <section className="text-gray-800 body-font w-[500px] object-contain mx-auto -mt-12">
                     <div className="container px-5 py-24 mx-auto">
                       <div className="flex flex-wrap -m-4">
                         <div className="mb-6 p-4">
@@ -277,7 +277,7 @@ function HomePage() {
                             <p className="leading-relaxed">Developers need to be able to quickly and consistently create event-driven applications that provide business value and react to customer needs in realtime. I can't count how many times I've heard developers ask for OpenAPI/Swagger style tools for the asynchronous and event driven world, and that is exactly what the AsyncAPI initiative is making a reality.</p>
                             <span className="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
                             <h2 className="text-gray-900 font-medium title-font tracking-wider text-sm">Jonathan Schabowsky</h2>
-                            <p className="text-gray-500">Sr. Architect, Office of the CTO at Solace</p>
+                            <p className="text-gray-700">Sr. Architect, Office of the CTO at Solace</p>
                           </div>
                         </div>
                       </div>
@@ -287,7 +287,7 @@ function HomePage() {
                   },
                   {
                   element: (
-                    <section className="text-gray-600 body-font w-[500px] object-contain mx-auto -mt-12">
+                    <section className="text-gray-800 body-font w-[500px] object-contain mx-auto -mt-12">
                     <div className="container px-5 py-24 mx-auto">
                       <div className="flex flex-wrap -m-4">
                         <div className="mb-6 p-4">
@@ -296,7 +296,7 @@ function HomePage() {
                             <p className="leading-relaxed">We’ve been focusing on event-driven APIs since 2014 and thank the AsyncAPI contributors everyday for driving the community towards common standards.</p>
                             <span className="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
                             <h2 className="text-gray-900 font-medium title-font tracking-wider text-sm">Eric Horesnyi</h2>
-                            <p className="text-gray-500">CEO at Streamdata.io</p>
+                            <p className="text-gray-700">CEO at Streamdata.io</p>
                           </div>
                         </div>
                       </div>