diff --git a/.idea/biome.xml b/.idea/biome.xml new file mode 100644 index 0000000..8fa01ec --- /dev/null +++ b/.idea/biome.xml @@ -0,0 +1,9 @@ + + + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 689d6b4..3039706 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@tanstack/react-router-ssr-query": "latest", "@tanstack/react-start": "latest", "@tanstack/router-plugin": "^1.132.0", + "@unpic/react": "^1.0.2", "lichess-pgn-viewer": "^2.4.5", "lucide-react": "^0.545.0", "nitro": "npm:nitro-nightly@latest", @@ -3438,6 +3439,34 @@ "@types/react": "^19.2.0" } }, + "node_modules/@unpic/core": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@unpic/core/-/core-1.0.3.tgz", + "integrity": "sha512-aum9YNVUGso7MjGLD0Rp/08kywCGLqZ03/q6VQBFFakDBOXWEc8D4kPGcZ8v5wEnGRex3lE+++bOuucBp3KJ/w==", + "license": "MIT", + "dependencies": { + "unpic": "^4.2.2" + } + }, + "node_modules/@unpic/react": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@unpic/react/-/react-1.0.2.tgz", + "integrity": "sha512-5RmRfELwTF8w+4zjtQGqjpvX+RU2VLvis3xDCS1O2uWk0PZN2cvatL+3/KAR3mshAuRrkFGTX1XwyAezSXaoCA==", + "license": "MIT", + "dependencies": { + "@unpic/core": "^1.0.3" + }, + "peerDependencies": { + "next": "^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "next": { + "optional": true + } + } + }, "node_modules/@vitejs/plugin-react": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-6.0.2.tgz", @@ -5682,6 +5711,12 @@ "pathe": "^2.0.3" } }, + "node_modules/unpic": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/unpic/-/unpic-4.2.2.tgz", + "integrity": "sha512-z6T2ScMgRV2y2H8MwwhY5xHZWXhUx/YxtOCGJwfURSl7ypVy4HpLIMWoIZKnnxQa/RKzM0kg8hUh0paIrpLfvw==", + "license": "MIT" + }, "node_modules/unplugin": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-3.0.0.tgz", diff --git a/package.json b/package.json index ecf0456..3576fa8 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "@tanstack/react-router-ssr-query": "latest", "@tanstack/react-start": "latest", "@tanstack/router-plugin": "^1.132.0", + "@unpic/react": "^1.0.2", "lichess-pgn-viewer": "^2.4.5", "lucide-react": "^0.545.0", "nitro": "npm:nitro-nightly@latest", diff --git a/src/assets/images/examplepdf1.webp b/src/assets/images/examplepdf1.webp new file mode 100644 index 0000000..85f64eb Binary files /dev/null and b/src/assets/images/examplepdf1.webp differ diff --git a/src/assets/images/examplepdf2.webp b/src/assets/images/examplepdf2.webp new file mode 100644 index 0000000..75bad88 Binary files /dev/null and b/src/assets/images/examplepdf2.webp differ diff --git a/src/assets/images/footerLogo.svg b/src/assets/images/footerLogo.svg new file mode 100644 index 0000000..3917e4e --- /dev/null +++ b/src/assets/images/footerLogo.svg @@ -0,0 +1,44 @@ + + + + + + + + + diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg new file mode 100644 index 0000000..f9ad529 --- /dev/null +++ b/src/assets/images/logo.svg @@ -0,0 +1,44 @@ + + + + + + + + + diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 0c9e3ea..c0c3822 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,68 +1,51 @@ -import { Link } from '@tanstack/react-router' +import { Link } from "@tanstack/react-router"; +import { Image } from "@unpic/react"; + +import logo from "@/assets/images/logo.svg?url"; export default function Header() { - return ( -
- +
+ ); } diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx index 3f7f8c2..8d976dd 100644 --- a/src/routes/__root.tsx +++ b/src/routes/__root.tsx @@ -1,61 +1,62 @@ -import { HeadContent, Scripts, createRootRoute } from '@tanstack/react-router' -import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools' -import { TanStackDevtools } from '@tanstack/react-devtools' -import Footer from '../components/Footer' -import Header from '../components/Header' +import { TanStackDevtools } from "@tanstack/react-devtools"; +import { createRootRoute, HeadContent, Scripts } from "@tanstack/react-router"; +import { TanStackRouterDevtoolsPanel } from "@tanstack/react-router-devtools"; +import type { ReactNode } from "react"; +import Footer from "../components/Footer"; +import Header from "../components/Header"; -import appCss from '../styles.css?url' +import appCss from "../styles.css?url"; -const THEME_INIT_SCRIPT = `(function(){try{var stored=window.localStorage.getItem('theme');var mode=(stored==='light'||stored==='dark'||stored==='auto')?stored:'auto';var prefersDark=window.matchMedia('(prefers-color-scheme: dark)').matches;var resolved=mode==='auto'?(prefersDark?'dark':'light'):mode;var root=document.documentElement;root.classList.remove('light','dark');root.classList.add(resolved);if(mode==='auto'){root.removeAttribute('data-theme')}else{root.setAttribute('data-theme',mode)}root.style.colorScheme=resolved;}catch(e){}})();` +const THEME_INIT_SCRIPT = `(function(){try{var stored=window.localStorage.getItem('theme');var mode=(stored==='light'||stored==='dark'||stored==='auto')?stored:'auto';var prefersDark=window.matchMedia('(prefers-color-scheme: dark)').matches;var resolved=mode==='auto'?(prefersDark?'dark':'light'):mode;var root=document.documentElement;root.classList.remove('light','dark');root.classList.add(resolved);if(mode==='auto'){root.removeAttribute('data-theme')}else{root.setAttribute('data-theme',mode)}root.style.colorScheme=resolved;}catch(e){}})();`; export const Route = createRootRoute({ - head: () => ({ - meta: [ - { - charSet: 'utf-8', - }, - { - name: 'viewport', - content: 'width=device-width, initial-scale=1', - }, - { - title: 'TanStack Start Starter', - }, - ], - links: [ - { - rel: 'stylesheet', - href: appCss, - }, - ], - }), - shellComponent: RootDocument, -}) + head: () => ({ + meta: [ + { + charSet: "utf-8", + }, + { + name: "viewport", + content: "width=device-width, initial-scale=1", + }, + { + title: "TanStack Start Starter", + }, + ], + links: [ + { + rel: "stylesheet", + href: appCss, + }, + ], + }), + shellComponent: RootDocument, +}); -function RootDocument({ children }: { children: React.ReactNode }) { - return ( - - -