diff --git a/frontend/src/components/LandingComponents/HowItWorks/HowItWorks.tsx b/frontend/src/components/LandingComponents/HowItWorks/HowItWorks.tsx
index 3de0c578..cb476e59 100644
--- a/frontend/src/components/LandingComponents/HowItWorks/HowItWorks.tsx
+++ b/frontend/src/components/LandingComponents/HowItWorks/HowItWorks.tsx
@@ -2,7 +2,10 @@ import { motion, useAnimation } from 'framer-motion';
import { useInView } from 'react-intersection-observer';
import { useEffect } from 'react';
import { Card, CardContent, CardHeader, CardTitle } from '../../ui/card';
-import { MedalIcon, MapIcon, PlaneIcon, GiftIcon } from '../../utils/Icons';
+import { LiaMedalSolid } from 'react-icons/lia';
+import { TbMapPin2 } from 'react-icons/tb';
+import { GiAirplaneDeparture } from 'react-icons/gi';
+import { GrServer } from 'react-icons/gr';
interface FeatureProps {
icon: JSX.Element;
@@ -12,25 +15,25 @@ interface FeatureProps {
const features: FeatureProps[] = [
{
- icon: ,
+ icon: ,
title: 'Sign in',
description:
'Sign in with Google to generate secret UUIDs, or generate your own using a random key generator',
},
{
- icon: ,
+ icon: ,
title: 'Setup',
description:
'Setup the taskserver for your Taskwarrior clients by following the documentation',
},
{
- icon: ,
+ icon: ,
title: 'Share',
description:
'Sign in on multiple devices and use the same UUIDs to sync tasks across all the clients or your team',
},
{
- icon: ,
+ icon: ,
title: 'Deploy your own',
description:
'You can also deploy your own server instance by following this documentation',
diff --git a/frontend/src/components/LandingComponents/HowItWorks/__tests__/__snapshots__/HowItWorks.test.tsx.snap b/frontend/src/components/LandingComponents/HowItWorks/__tests__/__snapshots__/HowItWorks.test.tsx.snap
index ee709f43..2c67d2eb 100644
--- a/frontend/src/components/LandingComponents/HowItWorks/__tests__/__snapshots__/HowItWorks.test.tsx.snap
+++ b/frontend/src/components/LandingComponents/HowItWorks/__tests__/__snapshots__/HowItWorks.test.tsx.snap
@@ -36,83 +36,20 @@ exports[`HowItWorks component using snapshot renders correctly 1`] = `
class="text-2xl font-semibold leading-none tracking-tight grid gap-4 place-items-center"
>
Sign in
@@ -138,79 +75,34 @@ exports[`HowItWorks component using snapshot renders correctly 1`] = `
class="text-2xl font-semibold leading-none tracking-tight grid gap-4 place-items-center"
>
Setup
@@ -236,63 +128,20 @@ exports[`HowItWorks component using snapshot renders correctly 1`] = `
class="text-2xl font-semibold leading-none tracking-tight grid gap-4 place-items-center"
>
Share
@@ -318,103 +167,22 @@ exports[`HowItWorks component using snapshot renders correctly 1`] = `
class="text-2xl font-semibold leading-none tracking-tight grid gap-4 place-items-center"
>
Deploy your own
diff --git a/frontend/src/components/utils/Icons.tsx b/frontend/src/components/utils/Icons.tsx
deleted file mode 100644
index 39c87c70..00000000
--- a/frontend/src/components/utils/Icons.tsx
+++ /dev/null
@@ -1,330 +0,0 @@
-export const LogoIcon = () => {
- return (
-
- );
-};
-
-export const MedalIcon = () => {
- return (
-
- );
-};
-
-export const MapIcon = () => {
- return (
-
- );
-};
-
-export const PlaneIcon = () => {
- return (
-
- );
-};
-
-export const GiftIcon = () => {
- return (
-
- );
-};