Skip to content

Commit

Permalink
Removed react-icons
Browse files Browse the repository at this point in the history
  • Loading branch information
@FleetAdmiralJakob
FleetAdmiralJakob committed Dec 3, 2024
1 parent fdfcbe3 commit c62674d
Show file tree
Hide file tree
Showing 5 changed files with 104 additions and 128 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
"@floating-ui/react": "^0.26.28",
"@hookform/resolvers": "^3.9.1",
"@ianvs/prettier-plugin-sort-imports": "^4.4.0",
"@icons-pack/react-simple-icons": "^10.2.0",
"@legendapp/state": "^3.0.0-beta.16",
"@radix-ui/react-avatar": "^1.1.1",
"@radix-ui/react-dialog": "^1.1.2",
Expand Down Expand Up @@ -57,7 +58,6 @@
"react": "19.0.0-rc-66855b96-20241106",
"react-dom": "19.0.0-rc-66855b96-20241106",
"react-hook-form": "^7.53.2",
"react-icons": "^5.3.0",
"react-intersection-observer": "^9.13.1",
"react-resizable-panels": "^2.1.7",
"react-responsive": "^10.0.0",
Expand Down
24 changes: 12 additions & 12 deletions pnpm-lock.yaml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

136 changes: 63 additions & 73 deletions src/app/contributors/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
"use client";

import { SiGithub, SiLinkedin } from "@icons-pack/react-simple-icons";
import Footer from "~/components/footer";
import { cn } from "~/lib/utils";
import {
Expand All @@ -12,8 +13,6 @@ import Image from "next/image";
import Link from "next/link";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { FaLinkedin } from "react-icons/fa";
import { SiGithub } from "react-icons/si";

export const dynamic = "force-static";

Expand Down Expand Up @@ -45,89 +44,80 @@ const contributorList: ContributorsProps[] = [
},
];

const ContributorCard = (props: {
contributor: ContributorsProps;
key?: number;
}) => {
const ContributorCard = (props: { contributor: ContributorsProps }) => {
const [cardOpen, setCardOpen] = useState(false);
return (
<React.Fragment key={props.key}>
<div
className={
"flex w-11/12 justify-between rounded-2xl border-2 border-secondary-foreground bg-card-foreground p-5 sm:w-7/12 lg:block lg:w-6/12 2xl:w-4/12"
}
>
<div className="flex items-center lg:justify-between">
<div className="flex flex-wrap items-center justify-start">
<Image
src={props.contributor.image}
alt={props.contributor.name}
width={50}
height={50}
className="order-0 rounded-full lg:flex"
/>
<div className="flex w-11/12 justify-between rounded-2xl border-2 border-secondary-foreground bg-card-foreground p-5 sm:w-7/12 lg:block lg:w-6/12 2xl:w-4/12">
<div className="flex items-center lg:justify-between">
<div className="flex flex-wrap items-center justify-start">
<Image
src={props.contributor.image}
alt={props.contributor.name}
width={50}
height={50}
className="order-0 rounded-full lg:flex"
/>

<div className="order-1 ml-4 mt-0.5 lg:flex lg:justify-between">
<p className="text-xl font-bold lg:mt-3">
{props.contributor.name}
</p>
<p className="mt-2.5 h-9 rounded-sm border-2 border-secondary-foreground bg-primary px-3 pt-1 font-medium text-secondary-foreground lg:ml-4">
{props.contributor.job}
</p>
</div>
<div className="order-1 ml-4 mt-0.5 lg:flex lg:justify-between">
<p className="text-xl font-bold lg:mt-3">
{props.contributor.name}
</p>
<p className="mt-2.5 h-9 rounded-sm border-2 border-secondary-foreground bg-primary px-3 pt-1 font-medium text-secondary-foreground lg:ml-4">
{props.contributor.job}
</p>
</div>
<CircleChevronUp
onClick={() => setCardOpen(!cardOpen)}
className={cn(
"ml-5 mt-2.5 hidden h-7 w-7 transition-transform duration-300 ease-in-out lg:flex",
{
"rotate-180 transform": cardOpen,
},
)}
/>
</div>
<div
<CircleChevronUp
onClick={() => setCardOpen(!cardOpen)}
className={cn(
"justify-around text-xl text-secondary-foreground underline lg:mt-3 lg:flex",
"ml-5 mt-2.5 hidden h-7 w-7 cursor-pointer transition-transform duration-300 ease-in-out lg:flex",
{
"transition-max-height duration-300 ease-in-out lg:max-h-0 lg:overflow-hidden":
!cardOpen,
"transition-max-height max-h-screen duration-300 ease-in-out":
cardOpen,
"rotate-180 transform": cardOpen,
},
)}
>
{props.contributor.website ? (
<Link
className={cn("hidden", {
flex: props.contributor.website,
})}
href={props.contributor.website}
>
<p className={"hidden cursor-pointer lg:flex"}>Website</p>
<LinkChain className="ml-1 mt-1 h-5 w-5" />
</Link>
) : null}
/>
</div>
<div
className={cn(
"justify-around text-xl text-secondary-foreground underline lg:mt-3 lg:flex",
{
"transition-max-height duration-300 ease-in-out lg:max-h-0 lg:overflow-hidden":
!cardOpen,
"transition-max-height max-h-screen duration-300 ease-in-out":
cardOpen,
},
)}
>
{props.contributor.website ? (
<Link
className={cn("hidden", {
flex: props.contributor.website,
})}
href={props.contributor.website}
>
<p className="hidden cursor-pointer lg:flex">Website</p>
<LinkChain className="ml-1 mt-1 h-5 w-5" />
</Link>
) : null}

{props.contributor.linkedin ? (
<Link className="flex" href={props.contributor.linkedin}>
<p className={"hidden cursor-pointer lg:flex"}>LinkedIn</p>
<FaLinkedin className="ml-1 mt-2.5 h-5 w-5 lg:mt-1" />
</Link>
) : null}
{props.contributor.linkedin ? (
<Link className="flex" href={props.contributor.linkedin}>
<p className="hidden cursor-pointer lg:flex">LinkedIn</p>
<SiLinkedin className="ml-1 mt-2.5 h-5 w-5 lg:mt-1" />
</Link>
) : null}

{props.contributor.github ? (
<Link
className={cn("hidden", { flex: props.contributor.github })}
href={props.contributor.github}
>
<p className={"hidden cursor-pointer lg:flex"}>GitHub</p>
<SiGithub className="ml-1 mt-2.5 h-5 w-5 lg:mt-1" />
</Link>
) : null}
</div>
{props.contributor.github ? (
<Link
className={cn("hidden", { flex: props.contributor.github })}
href={props.contributor.github}
>
<p className="hidden cursor-pointer lg:flex">GitHub</p>
<SiGithub className="ml-1 mt-2.5 h-5 w-5 lg:mt-1" />
</Link>
) : null}
</div>
</React.Fragment>
</div>
);
};

Expand Down
32 changes: 13 additions & 19 deletions src/app/public-homepage.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,17 @@
"use client";

import { SiGithub } from "@icons-pack/react-simple-icons";
import icon from "~/assets/chatio.png";
import { DevMode } from "~/components/dev-mode-info";
import Footer from "~/components/footer";
import { AuroraBackground } from "~/components/ui/aurora-background";
import { Button } from "~/components/ui/button";
import { devMode$ } from "~/states";
import { motion } from "framer-motion";
import { CloudDownload, ShieldCheck } from "lucide-react";
import { ArrowDown, CloudDownload, ShieldCheck } from "lucide-react";
import Image from "next/image";
import Link from "next/link";
import React, { useRef, useState } from "react";
import { FaCircleArrowDown } from "react-icons/fa6";
import { SiGithub } from "react-icons/si";

export default function PublicHomepage() {
const aboutRef = useRef<HTMLParagraphElement | null>(null);
Expand Down Expand Up @@ -65,7 +64,7 @@ export default function PublicHomepage() {
</p>
<div className="flex flex-col items-center gap-1 py-11">
<Link href="/sign-up">
<Button className="b bg-foreground p-6 text-2xl transition delay-150 duration-200 ease-in-out hover:bg-secondary-foreground hover:text-amber-50">
<Button className="bg-foreground p-6 text-2xl transition delay-150 duration-200 ease-in-out hover:bg-secondary-foreground hover:text-amber-50">
Sign Up
</Button>
</Link>
Expand All @@ -77,48 +76,43 @@ export default function PublicHomepage() {
scrollCallback();
}}
aria-label="Automatically scroll down to all the features of Chat.io"
className="flex aspect-square h-7 animate-bounce items-center justify-center rounded-full bg-foreground text-primary-foreground"
>
<FaCircleArrowDown className="h-7 animate-bounce text-2xl" />
<ArrowDown className="h-6" />
</button>
</div>
</motion.div>

<p
ref={aboutRef}
className={
"mb-20 mt-16 w-3/4 text-center text-2xl md:w-1/2 lg:w-1/4"
}
className="mb-20 mt-16 w-3/4 text-center text-2xl md:w-1/2 lg:w-1/4"
>
Discover the multitude of features packed into Chat.io
</p>

<div className={"block"}>
<div className="block">
<CloudDownload className="mb-2 ml-7 h-10 w-10" />
<p className="mb-5 text-xl">Installable</p>
</div>
<p className={"w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4"}>
<p className="w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4">
Whether you have on iOS, Android, Windows, or Mac, Chat.io installs
smoothly across all major platforms, ensuring a consistent and
reliable weather experience across all your devices.
</p>
<div>
<SiGithub className={"mb-2 ml-10 mt-16 text-4xl"} />
<p className={"mb-5 text-xl"}>Open Source</p>
<SiGithub className="mb-2 ml-10 mt-16 text-4xl" />
<p className="mb-5 text-xl">Open Source</p>
</div>
<p className={"w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4"}>
<p className="w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4">
By embracing open-source principles, Chat.io invites collaboration
and innovation from a global community of developers, ensuring a
robust and customizable chat solution tailored to your needs.
</p>
<div>
<ShieldCheck className="mb-2 ml-4 mt-16 h-10 w-10" />
<p className={"mb-5 text-xl"}>Privacy</p>
<p className="mb-5 text-xl">Privacy</p>
</div>
<p
className={
"mb-20 w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4"
}
>
<p className="mb-20 w-3/4 text-secondary-foreground md:w-1/2 lg:w-1/4">
Chat.io boasts strong security measures, including robust encryption
and strict access controls, ensuring user data is always
safeguarded.
Expand Down
Loading

0 comments on commit c62674d

Please sign in to comment.