diff --git a/client/src/App.css b/client/src/App.css index f202981..1d2bc97 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -1,67 +1,12 @@ -:root { - /* Catppuccin colors */ - /* Light mode */ - --light-text: #1e2030; - --light-background: #eff1f5; - --light-accent: #8839ef; - --light-highlight: #209fb5; - /* Dark mode */ - --dark-text: #cad3f5; - --dark-background: #24273a; - --dark-accent: #c6a0f6; - --dark-highlight: #7dc4e4; - - /* Global configs */ +html { color-scheme: light dark; font-family: system-ui; -} - -@media (prefers-color-scheme: light) { - html { - color: var(--light-text); - background-color: var(--light-background); - } - - h1 { - color: var(--light-highlight); - } -} - -@media (prefers-color-scheme: dark) { - html { - color: var(--dark-text); - background-color: var(--dark-background); - } - - h1 { - color: var(--dark-highlight); - } -} - -html { -} - -body { - min-height: 100svh; - height: fit-content; display: flex; - flex-direction: column; align-items: center; - margin: 0; -} - -#app { - height: 100%; - min-width: 100%; - display: flex; - flex-direction: column; - align-items: center; - align-content: center; justify-content: center; } -#body { - max-width: 40rem; - width: 100%; +body { height: 100%; + width: 100%; } diff --git a/client/src/App.tsx b/client/src/App.tsx index 82db791..b01dfa7 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,6 +1,6 @@ -import "@/App.css"; -import { About } from "@/pages/about"; -import { Root } from "@/pages/root"; +import "/src/App.css"; +import { About } from "./pages/about"; +import { Root } from "./pages/root"; import { BrowserRouter, Route, Routes } from "react-router"; export function App() { diff --git a/client/src/components/header/header.css b/client/src/components/header/header.css index a5862d7..dd546ca 100644 --- a/client/src/components/header/header.css +++ b/client/src/components/header/header.css @@ -1,14 +1,9 @@ header { - --margin: 0.25rem; - --padding: 0.25rem; + border-color: #c6a0f6; border-width: 2px; border-style: solid; - position: sticky; - - margin: var(--margin); - padding: var(--padding); - width: calc(100% - (2 * var(--margin)) - (2 * var(--padding)) - 4px); + position: sticky top; } nav { @@ -25,27 +20,8 @@ nav { } a { + color: #cad3f5; text-decoration: none; font-weight: bold; } } - -@media (prefers-color-scheme: light) { - header { - border-color: var(--light-accent); - } - - a { - color: var(--light-text); - } -} - -@media (prefers-color-scheme: dark) { - header { - border-color: var(--dark-accent); - } - - a { - color: var(--dark-text); - } -} diff --git a/client/src/components/header/index.tsx b/client/src/components/header/index.tsx index 90dcd5c..18eda90 100644 --- a/client/src/components/header/index.tsx +++ b/client/src/components/header/index.tsx @@ -1,4 +1,3 @@ -import "@/App.css"; import "./header.css"; import { Nav } from "./nav"; diff --git a/client/src/components/header/nav.tsx b/client/src/components/header/nav.tsx index 26938fb..68d2f24 100644 --- a/client/src/components/header/nav.tsx +++ b/client/src/components/header/nav.tsx @@ -5,17 +5,13 @@ export function Nav() { return ( ); } - -function NavLink(props: { path: string; name: string }) { - return ( -
  • - {props.name} -
    • - ); -} diff --git a/client/src/index.tsx b/client/src/index.tsx index 6dc29df..e2d3e7b 100644 --- a/client/src/index.tsx +++ b/client/src/index.tsx @@ -1,11 +1,11 @@ -import { createRoot } from "react-dom/client"; -import { StrictMode } from "react"; -import { App } from "@/App"; +import { createRoot } from 'react-dom/client'; +import { StrictMode } from 'react'; +import { App } from './App'; let container = document.getElementById("app")!; -let root = createRoot(container); +let root = createRoot(container) root.render( - , + ); diff --git a/client/src/pages/about.tsx b/client/src/pages/about.tsx index 2f9ee32..7af40d5 100644 --- a/client/src/pages/about.tsx +++ b/client/src/pages/about.tsx @@ -1,15 +1,16 @@ -import { Page } from "@/pages/page"; -import "@/App.css"; +import { Header } from "/src/components/header"; +import "/src/App.css"; export function About() { return ( - + <> +

    About Starve Me Now!

    Firstly, this is intended for those who have a starvation/diet control fetish. This is not intended to help with weight loss or similar reasons to fast.

    - + ); } diff --git a/client/src/pages/page.tsx b/client/src/pages/page.tsx deleted file mode 100644 index c48ab01..0000000 --- a/client/src/pages/page.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import { Header } from "@/components/header"; -import "@/App.css"; - -export function Page(props: { children: React.ReactNode }) { - return ( - <> -
    -
    {props.children}
    - - ); -} diff --git a/client/src/pages/root.tsx b/client/src/pages/root.tsx index 1060df5..7057d23 100644 --- a/client/src/pages/root.tsx +++ b/client/src/pages/root.tsx @@ -1,13 +1,14 @@ -import { Page } from "./page"; -import "@/App.css"; +import { Header } from "/src/components/header"; +import "/src/App.css"; export function Root() { return ( - + <> +

    Starve Me Now!

    Edit src/App.tsx to get started!

    - + ); } diff --git a/client/tsconfig.json b/client/tsconfig.json index d6ccc11..ddc2511 100644 --- a/client/tsconfig.json +++ b/client/tsconfig.json @@ -1,34 +1,29 @@ { - "compilerOptions": { - /* Visit https://aka.ms/tsconfig to read more about this file */ - "target": "ES2020", - "lib": ["ES2020", "DOM", "DOM.Iterable"], - "jsx": "react-jsx", - "useDefineForClassFields": true, + "compilerOptions": { + /* Visit https://aka.ms/tsconfig to read more about this file */ + "target": "ES2020", + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "jsx": "react-jsx", + "useDefineForClassFields": true, - /* Modules */ - "module": "ESNext", - "moduleResolution": "bundler", + /* Modules */ + "module": "ESNext", + "moduleResolution": "bundler", - /* Emit */ - "noEmit": true, + /* Emit */ + "noEmit": true, - /* Interop Constraints */ - "isolatedModules": true, - "allowSyntheticDefaultImports": true, - "allowImportingTsExtensions": true, - "esModuleInterop": true, - "forceConsistentCasingInFileNames": true, + /* Interop Constraints */ + "isolatedModules": true, + "allowSyntheticDefaultImports": true, + "allowImportingTsExtensions": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, - /* Type Checking */ - "strict": true, + /* Type Checking */ + "strict": true, - /* Completeness */ - "skipLibCheck": true, - - "baseUrl": "./src", - "paths": { - "@/*": ["*"] - } - } + /* Completeness */ + "skipLibCheck": true + } }