100 lines
3.9 KiB
TypeScript
100 lines
3.9 KiB
TypeScript
import { createRootRoute, Outlet } from "@tanstack/react-router"
|
|
import { TanStackRouterDevtools } from "@tanstack/react-router-devtools"
|
|
import { useTranslation } from "react-i18next"
|
|
import { DiGit } from "react-icons/di"
|
|
import { FaCode } from "react-icons/fa"
|
|
import root from "react-shadow"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Card, CardContent } from "@/components/ui/card"
|
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
|
|
|
|
|
|
export const Route = createRootRoute({
|
|
component: RootComponent,
|
|
})
|
|
|
|
function RootComponent() {
|
|
const { t, i18n } = useTranslation()
|
|
|
|
return <>
|
|
<div className="flex flex-row items-center justify-center gap-2 p-2">
|
|
<Button
|
|
variant={i18n.language !== "en" ? "default" : "noShadow"}
|
|
onClick={() => i18n.changeLanguage("en")}
|
|
>
|
|
🇬🇧 English
|
|
</Button>
|
|
|
|
<Button
|
|
variant={i18n.language !== "fr" ? "default" : "noShadow"}
|
|
onClick={() => i18n.changeLanguage("fr")}
|
|
>
|
|
🇫🇷 Français
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="container mt-20 mr-auto ml-auto">
|
|
<div className="mr-auto ml-auto flex w-fit flex-row items-start justify-around gap-10">
|
|
<root.div>
|
|
<link rel="stylesheet" href="/98.css/dist/98.css" />
|
|
|
|
<div className="window" style={{ width: 300 }}>
|
|
<div className="title-bar">
|
|
<div className="title-bar-text">Julien Valverde</div>
|
|
</div>
|
|
<div className="window-body">
|
|
<p>There's so much room for activities!</p>
|
|
</div>
|
|
</div>
|
|
</root.div>
|
|
|
|
<div>
|
|
<h1>Ingénieur Full Stack • Entrepreneur</h1>
|
|
|
|
<p className="mt-2">
|
|
I am passionate about integrating functionality and design in applications to create intuitive, user-friendly experiences.
|
|
</p>
|
|
|
|
<div className="flex w-fit flex-row items-center justify-center gap-2 mt-4">
|
|
<TooltipProvider>
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<Button asChild>
|
|
<a href="https://git.valverde.cloud"><DiGit /> {t($ => $.gitRepos.title, { ns: "nav" })}</a>
|
|
</Button>
|
|
</TooltipTrigger>
|
|
|
|
<TooltipContent><p>{t($ => $.gitRepos.tooltip, { ns: "nav" })}</p></TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
|
|
<TooltipProvider>
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<Button asChild>
|
|
<a href="https://git.valverde.cloud/thilawyn/website"><FaCode /> {t($ => $.sourceCode.title, { ns: "nav" })}</a>
|
|
</Button>
|
|
</TooltipTrigger>
|
|
|
|
<TooltipContent><p>{t($ => $.sourceCode.tooltip, { ns: "nav" })}</p></TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
|
|
<Button>Resumé</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mx-auto w-[750px] max-w-full px-5 pt-28 pb-10 text-foreground">
|
|
<Card>
|
|
<CardContent>
|
|
<Outlet />
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
|
|
<TanStackRouterDevtools />
|
|
</>
|
|
}
|