notkshitij/CropCompass
1
1
Fork 0
Code Issues 8 Pull Requests Projects 1 Releases Activity

Fix:Replaced Class with className

Browse Source
This commit is contained in:
Atharva
2025-02-23 07:30:54 +05:30
parent 92b647fa0e
commit 29e2d49ef6
1 changed files with 108 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Frontend/src/pages/Home/Hero.jsx
+106 -51
View File
@@ -17,77 +17,135 @@ const Hero = () => {
</div> </div>
</div> </div>
<div className="w-full md:w-4/5 object-contain flex justify-center items-center"> <div className="w-full md:w-4/5 object-contain flex justify-center items-center">
<img src="/images/plant.png" className="w-full h-auto rounded-3xl shadow-xl" alt="plant" /> <img
src="/images/plant.png"
className="w-full h-auto rounded-3xl shadow-xl"
alt="plant"
/>
</div> </div>
</div> </div>
</section> </section>
<div className=" flex justify-center"> <div className=" flex justify-center">
<div className=" flex justify-between py-8 w-5/6 "> <div className=" flex justify-between py-8 w-5/6 ">
<div className="max-w-sm rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700">
<div class="max-w-sm rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700"> <a href="#">
<img
className="rounded-t-lg"
src="/images/plant.png"
alt="plant"
/>
</a>
<div className="p-8 backdrop-blur-md rounded-b-lg">
<a href="#"> <a href="#">
<img class="rounded-t-lg" src="/images/plant.png" alt="plant" /> <h5 className="mb-2 text-2xl font-bold tracking-tight text-white dark:text-white">
Noteworthy technology acquisitions 2021
</h5>
</a> </a>
<div class="p-8 backdrop-blur-md rounded-b-lg"> <p className="mb-3 font-normal text-white dark:text-gray-400">
<a href="#"> Here are the biggest enterprise technology acquisitions of 2021
<h5 class="mb-2 text-2xl font-bold tracking-tight text-white dark:text-white">Noteworthy technology acquisitions 2021</h5> so far, in reverse chronological order.
</a> </p>
<p class="mb-3 font-normal text-white dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p> <a
<a href="#" class="inline-flex shadow-md backdrop-blur-md bg-gradient-to-tr from-gray-700/20 to-gray-50/20 items-center px-3 py-2 text-sm font-medium text-center text-white rounded-lg hover:backdrop-blur-xl "> href="#"
Read more className="inline-flex shadow-md backdrop-blur-md bg-gradient-to-tr from-gray-700/20 to-gray-50/20 items-center px-3 py-2 text-sm font-medium text-center text-white rounded-lg hover:backdrop-blur-xl "
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10"> >
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/> Read more
</svg> <svg
</a> className="rtl:rotate-180 w-3.5 h-3.5 ms-2"
</div> aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 14 10"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M1 5h12m0 0L9 1m4 4L9 9"
/>
</svg>
</a>
</div>
</div> </div>
<div className="flex flex-col gap-10 justify-between "> <div className="flex flex-col gap-10 justify-between ">
<div> <div>
<a href="#" class="block max-w-sm p-6 rounded-lg shadow-md backdrop-blur-md dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"> <a
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">Noteworthy technology acquisitions 2021</h5> href="#"
<p class="font-normal text-gray-50 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p> className="block max-w-sm p-6 rounded-lg shadow-md backdrop-blur-md dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
>
<h5 className="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">
Noteworthy technology acquisitions 2021
</h5>
<p className="font-normal text-gray-50 dark:text-gray-400">
Here are the biggest enterprise technology acquisitions of
2021 so far, in reverse chronological order.
</p>
</a> </a>
</div> </div>
<div className="max-w-sm p-6 backdrop-blur-md rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700">
<div class="max-w-sm p-6 backdrop-blur-md rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700"> <a href="#">
<a href="#"> <h5 className="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">Noteworthy technology acquisitions 2021</h5> Noteworthy technology acquisitions 2021
</a> </h5>
<p class="mb-3 font-normal text-gray-50 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p> </a>
<a href="#" class="inline-flex shadow-md backdrop-blur-md bg-gradient-to-tr from-gray-700/20 to-gray-50/20 items-center px-3 py-2 text-sm font-medium text-center text-white rounded-lg hover:backdrop-blur-xl "> <p className="mb-3 font-normal text-gray-50 dark:text-gray-400">
Read more Here are the biggest enterprise technology acquisitions of 2021
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10"> so far, in reverse chronological order.
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/> </p>
</svg> <a
</a> href="#"
className="inline-flex shadow-md backdrop-blur-md bg-gradient-to-tr from-gray-700/20 to-gray-50/20 items-center px-3 py-2 text-sm font-medium text-center text-white rounded-lg hover:backdrop-blur-xl "
>
Read more
<svg
className="rtl:rotate-180 w-3.5 h-3.5 ms-2"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 14 10"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M1 5h12m0 0L9 1m4 4L9 9"
/>
</svg>
</a>
</div> </div>
</div> </div>
<div className=" flex flex-col justify-between"> <div className=" flex flex-col justify-between">
<div className="w-full max-w-sm bg-white rounded-lg shadow-xl dark:bg-gray-800 dark:border-gray-700">
<div class="w-full max-w-sm bg-white rounded-lg shadow-xl dark:bg-gray-800 dark:border-gray-700"> <a href="#">
<a href="#"> <img
<img class=" rounded-lg" src="/images/plant.png" alt="product image" /> className=" rounded-lg"
</a> src="/images/plant.png"
</div> alt="product image"
/>
<div>
<a href="#" class="block max-w-sm p-6 backdrop-blur-xl rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700">
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">Noteworthy technology acquisitions 2021</h5>
<p class="font-normal text-gray-50 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p>
</a> </a>
</div> </div>
<div>
<a
href="#"
className="block max-w-sm p-6 backdrop-blur-xl rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
>
<h5 className="mb-2 text-2xl font-bold tracking-tight text-gray-50 dark:text-white">
Noteworthy technology acquisitions 2021
</h5>
<p className="font-normal text-gray-50 dark:text-gray-400">
Here are the biggest enterprise technology acquisitions of
2021 so far, in reverse chronological order.
</p>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</> </>
@@ -96,7 +154,4 @@ const Hero = () => {
export default Hero; export default Hero;
// {grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2} // {grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2}