xevion/xevion.dev
1
0
Fork 0
mirror of https://github.com/Xevion/xevion.dev.git synced 2025-12-16 06:13:57 -06:00
Code Issues Packages Projects Releases Wiki Activity

Add more projects, lower vertical gap

Browse Source
This commit is contained in:
Xevion
2023-05-13 12:24:24 -05:00
parent e8fc29092b
commit d44150062a
1 changed files with 42 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/pages/projects.tsx
View File

@@ -1,12 +1,14 @@
import {type NextPage} from "next"; import {type NextPage} from "next";
import AppWrapper from "../components/AppWrapper"; import AppWrapper from "../components/AppWrapper";
import {RiMagicLine} from "react-icons/ri"; import {RiMagicLine} from "react-icons/ri";
import {BiHash, BiNetworkChart} from "react-icons/bi"; import {BiBus, BiHash, BiNetworkChart} from "react-icons/bi";
import Link from "next/link"; import Link from "next/link";
import {IconType} from "react-icons"; import {IconType} from "react-icons";
import {HiOutlineRss} from "react-icons/hi"; import {HiOutlineRss} from "react-icons/hi";
import {GiPathDistance} from "react-icons/gi"; import {GiHummingbird, GiPathDistance} from "react-icons/gi";
import {MdOutlineGrain} from "react-icons/md"; import {MdOutlineGrain, MdOutlineDns, MdOutlineLeaderboard} from "react-icons/md";
import {FiLayers} from "react-icons/fi";
import {FaReact} from "react-icons/fa";
const ProjectsPage: NextPage = () => { const ProjectsPage: NextPage = () => {
const projects: { name: string, description: string, url?: string, icon: IconType }[] = [ const projects: { name: string, description: string, url?: string, icon: IconType }[] = [
@@ -45,10 +47,46 @@ const ProjectsPage: NextPage = () => {
description: "Pretty SVG-based Noise", description: "Pretty SVG-based Noise",
url: "https://grain.xevion.dev", url: "https://grain.xevion.dev",
icon: MdOutlineGrain icon: MdOutlineGrain
},
{
name: "The Office",
description: "View Quotes from The Office",
url: "https://the-office.xevion.dev",
icon: FiLayers
},
{
name: "Boids",
description: "Flocking Simulation",
url: "https://github.com/Xevion/Boids",
icon: GiHummingbird
},
{
name: "bus-reminder",
description: "Last Bus Departure Reminder",
url: "http://github.com/Xevion/bus-reminder",
icon: BiBus
},
{
name: "rdap",
description: "Javascript RDAP Client",
url: "https://github.com/Xevion/rdap",
icon: MdOutlineDns
},
{
name: "icons",
description: "Dynamic React-Icons Loading",
url: "https://github.com/Xevion/icons",
icon: FaReact
},
{
name: "trivia",
description: "Trivia Leaderboard in Flask",
url: "http://github.com/Xevion/trivia",
icon: MdOutlineLeaderboard
} }
] ]
return <AppWrapper current='projects'> return <AppWrapper current='projects'>
<div className="mt-20 grid grid-cols-3 gap-20 h-full py-2 max-w-500 w-max mx-auto flex "> <div className="mt-20 grid grid-cols-3 gap-x-20 gap-y-10 h-full py-2 max-w-500 w-max mx-auto flex ">
{projects.map(({name, description, url, icon: Icon}) => <Link {projects.map(({name, description, url, icon: Icon}) => <Link
key={name} key={name}
className="relative flex flex-shrink items-center opacity-75 hover:opacity-100 transition-opacity" className="relative flex flex-shrink items-center opacity-75 hover:opacity-100 transition-opacity"