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

Remove old project paths

Browse Source
This commit is contained in:
Xevion
2024-12-26 17:13:04 -06:00
parent fcf4326e02
commit e798b5c053
5 changed files with 4 additions and 305 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/pages/grain.tsx
View File

@@ -1,102 +0,0 @@
import type { NextPage } from "next";
import Head from "next/head";
import Image from "next/image";
import { BsGithub } from "react-icons/bs";
import { RxOpenInNewWindow } from "react-icons/rx";
import Link from "next/link";
import AppWrapper from "@/components/AppWrapper";
import type { ReactNode } from "react";
type Screenshot = [string, null | string | ReactNode];
type ScreenshotWithQuality = [string, null | string | ReactNode, number];
const images: (Screenshot | ScreenshotWithQuality)[] = [
["/grain/index.jpg", null, 100],
["/grain/hidden.jpg", null, 100],
];
const GrainPage: NextPage = () => {
return (
<>
<Head>
<title>Grain | Xevion.dev</title>
</Head>
<AppWrapper>
<div className="flex h-full min-h-screen w-full justify-center overflow-auto">
<div className="relative my-10 w-full max-w-screen-md p-3 px-6">
<div className="flex justify-between pb-2">
<div className="text-3xl font-semibold">Grain</div>
<div className="flex items-center justify-end space-x-1.5">
<Link href="https://grain.xevion.dev" target="_blank">
<RxOpenInNewWindow className="h-6 w-6 hover:text-zinc-200" />
</Link>
<Link href="https://github.com/Xevion/grain" target="_blank">
<BsGithub className="h-6 w-6 hover:text-zinc-200" />
</Link>
</div>
</div>
<div className="relative">
<Link href="https://grain.xevion.dev/">
<Image
fill
quality={100}
sizes="100vw"
src="/grain/banner.jpeg"
alt=""
className="pointer-events-none !relative min-h-[10rem] rounded-md object-cover"
/>
</Link>
</div>
<div className="prose prose-lg prose-invert mt-3 w-full">
<p>
After seeing an online post with beautiful noise patterns &
gradients, I decided to try and recreate it. The result was
Grain, a simple web app that generates beautiful noise. Under
the hood, this app uses multiple layers of SVGs that
automatically rescale with the browsers viewport. That way, the
noise is always crisp and clear, no matter the screen size.
</p>
<ul className="md:columns-2">
<li>Performant - SVG generation and layering is optimized</li>
<li>Small - Builds in less than 16 seconds</li>
<li>
Open Source - Want to use my gradients? Check it out on{" "}
<Link href="https://github.com/Xevion/grain" target="_blank">
GitHub
</Link>
.
</li>
</ul>
<h3>Screenshots</h3>
<div className="relative space-y-8">
{images.map(([src, description, quality]) => {
return (
<div
key={src}
className="flex w-full flex-col justify-center"
>
<Image
fill
sizes="100vw"
src={src}
alt=""
quality={quality ?? 75}
className="pointer-events-none !relative !my-1 min-h-[10rem] rounded-md object-cover shadow-lg"
/>
{description != null ? (
<span className="text-center text-base">
{description}
</span>
) : null}
</div>
);
})}
</div>
</div>
</div>
</div>
</AppWrapper>
</>
);
};
export default GrainPage;

15
src/pages/index.tsx
View File

@@ -1,14 +1,13 @@
import AppWrapper from "@/components/AppWrapper";
import ItemCard from "@/components/ItemCard";
import directus, { type Project } from "@/utils/directus";
import { useBreakpointValue } from "@/utils/helpers";
import { readItems, readSingleton } from "@directus/sdk";
import { GetStaticPropsResult, type NextPage } from "next";
import Head from "next/head";
import Link from "next/link";
import { useEffect } from "react";
import Balancer from "react-wrap-balancer";
import AppWrapper from "@/components/AppWrapper";
import ItemCard from "@/components/ItemCard";
import directus, { type Project } from "@/utils/directus";
import { useBreakpointValue } from "@/utils/helpers";
import dynamic from "next/dynamic";
type IndexProps = {
tagline: string;
@@ -16,11 +15,6 @@ type IndexProps = {
buttons: { text: string; href: string }[];
};
const DotsDynamic = dynamic(
() => import('@/components/Dots'),
{ ssr: false }
)
export async function getStaticProps(): Promise<
GetStaticPropsResult<IndexProps>
> {
@@ -68,7 +62,6 @@ const Home: NextPage<IndexProps> = ({
</Head>
<AppWrapper hideNavigation={true} className="overflow-x-hidden">
<div className="flex h-screen w-screen items-center justify-center overflow-hidden">
<DotsDynamic />
<div className="flex w-full flex-col items-center justify-start">
<nav className="animate-fade-in">
<ul className="flex items-center justify-center gap-4">

13
src/pages/paths.tsx
View File

@@ -1,13 +0,0 @@
import { type NextPage } from "next";
import AppWrapper from "@/components/AppWrapper";
import WorkInProgress from "@/components/WorkInProgress";
const PathsPage: NextPage = () => {
return (
<AppWrapper>
<WorkInProgress />
</AppWrapper>
);
};
export default PathsPage;

65
src/pages/phototag.tsx
View File

@@ -1,65 +0,0 @@
import { NextPage } from "next";
import Head from "next/head";
import Image from "next/image";
import { BsGithub } from "react-icons/bs";
import Link from "next/link";
import AppWrapper from "@/components/AppWrapper";
const PhototagPage: NextPage = () => {
return (
<>
<Head>
<title>Phototag | Xevion.dev</title>
</Head>
<AppWrapper>
<div className="flex h-full min-h-screen w-full justify-center overflow-auto">
<div className="relative my-10 w-full max-w-screen-md p-3 px-6">
<div className="flex justify-between pb-2">
<div className="text-2xl font-semibold">Phototag</div>
<div className="flex items-center justify-end space-x-1.5">
<Link href="https://github.com/Xevion/phototag" target="_blank">
<BsGithub className="h-5 w-5 hover:text-zinc-200" />
</Link>
</div>
</div>
<div className="relative">
<Image
fill
sizes="100vw"
src="/phototag.png"
alt=""
className="pointer-events-none !relative min-h-[10rem] rounded-md object-cover"
/>
</div>
<div className="prose prose-lg prose-invert mt-3 w-full">
<p>
Phototag is a powerful tool that helps you quickly and easily
add rich, descriptive tags to your photos. Using Google&apos;s
Vision API, Phototag automatically generates tags based on the
visual content of your photos, making it easier than ever to
organize and find your photos.
</p>
<p>
With support for IPTC metadata and Adobe XMP Sidecar files, you
can easily integrate Phototag into your existing workflow on
Windows. Whether you&apos;re a professional photographer or a
casual snapshot taker, Phototag is the perfect tool for adding
clarity and context to your photos.
</p>
<ul className="md:columns-2">
<li>Simple, but configurable</li>
<li>Fully automatic</li>
<li>Leverages compression to reduce network load</li>
<li>Supports JPEG, PNG, GIF etc.</li>
<li>Supports IPTC metadata</li>
<li>Supports Adobe XMP sidecar files</li>
</ul>
</div>
</div>
</div>
</AppWrapper>
</>
);
};
export default PhototagPage;

114
src/pages/portal.tsx
View File

@@ -1,114 +0,0 @@
import type { NextPage } from "next";
import Head from "next/head";
import Image from "next/image";
import { BsGithub } from "react-icons/bs";
import Link from "next/link";
import AppWrapper from "@/components/AppWrapper";
import type { ReactNode } from "react";
const images: [string, string | ReactNode][] = [
["/portal/home.jpeg", "The home page."],
[
"/portal/events.png",
<>
{" "}
A page listing all current events. <br /> Initial data is cached for
performance, but becomes dynamic when filtered.
</>,
],
[
"/portal/admin.png",
"A secure admin panel for our officers to view, filter & edit members & events.",
],
["/portal/event.png", "The view of a specific event."],
["/portal/checkin.png", "The check-in view."],
[
"/portal/filters.png",
"Organization filtering options. Dynamic semester filtering & event sorting is also available.",
],
["/portal/login.png", "The login. Fast form validation, seamless login."],
[
"/portal/profile.png",
<>
The member profile view; fully editable on both desktop & mobile. <br />{" "}
Seamless editing of profiles for users. Full validation available.
</>,
],
[
"/portal/status.png",
"Members can check their progress towards becoming full members & view what events they attended.",
],
];
const PortalPage: NextPage = () => {
return (
<>
<Head>
<title>Portal | Xevion.dev</title>
</Head>
<AppWrapper>
<div className="flex h-full min-h-screen w-full justify-center overflow-auto">
<div className="relative my-10 w-full max-w-screen-md p-3 px-6">
<div className="flex justify-between pb-2">
<div className="text-3xl font-semibold">Portal</div>
<div className="flex items-center justify-end space-x-1.5">
<Link href="https://github.com/acmutsa/Portal" target="_blank">
<BsGithub className="h-6 w-6 hover:text-zinc-200" />
</Link>
</div>
</div>
<div className="relative">
<Link href="https://portal.acmutsa.org/">
<Image
fill
sizes="100vw"
src="/portal/banner.jpeg"
alt=""
className="pointer-events-none !relative min-h-[10rem] rounded-md object-cover"
/>
</Link>
</div>
<div className="prose prose-lg prose-invert mt-3 w-full">
<p>
Created in service of our membership, Portal was designed as a
approachable membership portal for our users so we could{" "}
<b>track membership</b>, <b>advertise events</b> and replace our
existing <b>database solution</b>.
</p>
<ul className="md:columns-2">
<li>Fast - built to serve thousands</li>
<li>Cheap - minimize costs</li>
<li>Open Source - help us improve</li>
<li>Cutting Edge - the latest technology</li>
</ul>
<h3>Screenshots</h3>
<div className="relative space-y-8">
{images.map(([src, description]) => {
return (
<div
key={src}
className="flex w-full flex-col justify-center"
>
<Image
fill
sizes="100vw"
src={src}
alt=""
className="pointer-events-none !relative !my-1 min-h-[10rem] rounded-md object-cover shadow-lg"
/>
<span className="text-center text-base">
{description}
</span>
</div>
);
})}
</div>
</div>
</div>
</div>
</AppWrapper>
</>
);
};
export default PortalPage;