Skip to content

Commit

Permalink
fix: sonar cloud issues
Browse files Browse the repository at this point in the history
  • Loading branch information
htnghia1423 committed Jan 19, 2025
1 parent 5eaa8b6 commit 3ce8a59
Show file tree
Hide file tree
Showing 2 changed files with 40 additions and 77 deletions.
28 changes: 14 additions & 14 deletions src/components/commons/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import {

export const Footer = () => {
return (
<div
<footer
className="flex flex-col justify-center items-center pt-12 bg-neutral-800"
role="contentinfo"
>
Expand Down Expand Up @@ -94,7 +94,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Development
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -105,7 +105,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Finance & Accounting
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -116,7 +116,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Design
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -127,7 +127,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Business
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -148,7 +148,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
About
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -159,7 +159,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Become Instructor
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -170,7 +170,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Contact
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -181,7 +181,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Career
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -202,7 +202,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Help Center
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -213,7 +213,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 whitespace-nowrap bg-neutral-800 hover:bg-transparent hover:text-white group"
>
FAQs
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -224,7 +224,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Terms & Condition
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand All @@ -235,7 +235,7 @@ export const Footer = () => {
className="relative gap-3 self-stretch py-1.5 pr-8 bg-neutral-800 hover:bg-transparent hover:text-white group"
>
Privacy Policy
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100"></span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-orange-500 transform scale-x-0 transition-transform duration-300 group-hover:scale-x-100" />
<FaArrowRightLong
className="absolute right-2 top-1/2 transform -translate-y-1/2 opacity-0 transition-opacity duration-300 group-hover:opacity-100"
color="#fff"
Expand Down Expand Up @@ -303,6 +303,6 @@ export const Footer = () => {
</DropdownMenuContent>
</DropdownMenu>
</div>
</div>
</footer>
);
};
89 changes: 26 additions & 63 deletions src/components/home/BrowseCategories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,8 @@ import { Button } from '@/components/ui/button';

export const BrowseCategories = () => {
return (
<div
<section
className="flex flex-col justify-center items-center px-72 py-20 max-md:px-5"
role="region"
aria-labelledby="browse-categories-title"
>
<h2
Expand All @@ -32,10 +31,7 @@ export const BrowseCategories = () => {
</h2>
<div className="flex flex-col mt-10 max-md:max-w-full">
<div className="grid grid-cols-4 gap-6 max-md:grid-cols-1">
<div
className="flex gap-5 justify-center items-center p-5 bg-violet-100 min-w-[240px]"
role="article"
>
<article className="flex gap-5 justify-center items-center p-5 bg-violet-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<HiChip className="object-contain w-8 h-8" color="#564FFD" />
</div>
Expand All @@ -47,11 +43,8 @@ export const BrowseCategories = () => {
63,476 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-green-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-green-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiHandshakeDuotone
className="object-contain w-8 h-8"
Expand All @@ -66,11 +59,8 @@ export const BrowseCategories = () => {
52,822 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiCreditCardDuotone
className="object-contain w-8 h-8"
Expand All @@ -85,11 +75,8 @@ export const BrowseCategories = () => {
33,841 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-rose-50 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-rose-50 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiChartBarHorizontal
className="object-contain w-8 h-8"
Expand All @@ -104,11 +91,8 @@ export const BrowseCategories = () => {
22,649 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-white shadow-2xl min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-white shadow-2xl min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-orange-500">
<PiBugDroidBold
className="object-contain w-8 h-8"
Expand All @@ -123,11 +107,8 @@ export const BrowseCategories = () => {
20,126 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-slate-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-slate-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiReceiptDuotone className="object-contain w-8 h-8" />
</div>
Expand All @@ -139,11 +120,8 @@ export const BrowseCategories = () => {
13,932 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-violet-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-violet-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiMegaphoneSimpleDuotone
className="object-contain w-8 h-8"
Expand All @@ -158,11 +136,8 @@ export const BrowseCategories = () => {
12,068 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-slate-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-slate-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiCameraDuotone className="object-contain w-8 h-8" />
</div>
Expand All @@ -174,11 +149,8 @@ export const BrowseCategories = () => {
6,196 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiPackageDuotone
className="object-contain w-8 h-8"
Expand All @@ -193,11 +165,8 @@ export const BrowseCategories = () => {
2,736 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-rose-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-rose-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<FiPenTool className="object-contain w-8 h-8" color="#FF6636" />
</div>
Expand All @@ -209,11 +178,8 @@ export const BrowseCategories = () => {
2,600 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-green-100 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-green-100 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiFirstAidKitDuotone
className="object-contain w-8 h-8"
Expand All @@ -228,11 +194,8 @@ export const BrowseCategories = () => {
1,678 Courses
</p>
</div>
</div>
<div
className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]"
role="article"
>
</article>
<article className="flex gap-5 justify-center items-center p-5 bg-orange-50 min-w-[240px]">
<div className="flex gap-2.5 items-center self-stretch p-4 my-auto w-16 h-16 bg-white">
<PiHeadphonesDuotone
className="object-contain w-8 h-8"
Expand All @@ -247,7 +210,7 @@ export const BrowseCategories = () => {
959 Courses
</p>
</div>
</div>
</article>
</div>
</div>
<div className="flex gap-3 items-center mt-10 text-sm tracking-normal text-center">
Expand All @@ -269,6 +232,6 @@ export const BrowseCategories = () => {
/>
</Button>
</div>
</div>
</section>
);
};

0 comments on commit 3ce8a59

Please sign in to comment.