style: 🎨 initial format applied

This commit is contained in:
Julien Oculi 2024-01-10 17:23:46 +01:00
parent 1e778e63d3
commit 4a6968e933
12 changed files with 138 additions and 135 deletions

View file

@ -7,7 +7,6 @@
"features": {
"ghcr.io/devcontainers-community/features/deno:1": {}
}
// Features to add to the dev container. More info: https://containers.dev/features.
// "features": {},

View file

@ -1,12 +1,12 @@
import { JSX } from "preact";
import { IS_BROWSER } from "$fresh/runtime.ts";
import { JSX } from 'preact'
import { IS_BROWSER } from '$fresh/runtime.ts'
export function Button(props: JSX.HTMLAttributes<HTMLButtonElement>) {
return (
<button
{...props}
disabled={!IS_BROWSER || props.disabled}
class="px-2 py-1 border-gray-500 border-2 rounded bg-white hover:bg-gray-200 transition-colors"
class='px-2 py-1 border-gray-500 border-2 rounded bg-white hover:bg-gray-200 transition-colors'
/>
);
)
}

View file

@ -1,8 +1,8 @@
#!/usr/bin/env -S deno run -A --watch=static/,routes/
import dev from "$fresh/dev.ts";
import config from "./fresh.config.ts";
import dev from '$fresh/dev.ts'
import config from './fresh.config.ts'
import "$std/dotenv/load.ts";
import '$std/dotenv/load.ts'
await dev(import.meta.url, "./main.ts", config);
await dev(import.meta.url, './main.ts', config)

View file

@ -1,3 +1,3 @@
import { defineConfig } from "$fresh/server.ts";
import { defineConfig } from '$fresh/server.ts'
export default defineConfig({});
export default defineConfig({})

View file

@ -1,16 +1,16 @@
import type { Signal } from "@preact/signals";
import { Button } from "../components/Button.tsx";
import type { Signal } from '@preact/signals'
import { Button } from '../components/Button.tsx'
interface CounterProps {
count: Signal<number>;
count: Signal<number>
}
export default function Counter(props: CounterProps) {
return (
<div class="flex gap-8 py-6">
<div class='flex gap-8 py-6'>
<Button onClick={() => props.count.value -= 1}>-1</Button>
<p class="text-3xl tabular-nums">{props.count}</p>
<p class='text-3xl tabular-nums'>{props.count}</p>
<Button onClick={() => props.count.value += 1}>+1</Button>
</div>
);
)
}

View file

@ -4,10 +4,10 @@
/// <reference lib="dom.asynciterable" />
/// <reference lib="deno.ns" />
import "$std/dotenv/load.ts";
import '$std/dotenv/load.ts'
import { start } from "$fresh/server.ts";
import manifest from "./fresh.gen.ts";
import config from "./fresh.config.ts";
import { start } from '$fresh/server.ts'
import manifest from './fresh.gen.ts'
import config from './fresh.config.ts'
await start(manifest, config);
await start(manifest, config)

View file

@ -1,4 +1,4 @@
import { Head } from "$fresh/runtime.ts";
import { Head } from '$fresh/runtime.ts'
export default function Error404() {
return (
@ -6,22 +6,22 @@ export default function Error404() {
<Head>
<title>404 - Page not found</title>
</Head>
<div class="px-4 py-8 mx-auto bg-[#86efac]">
<div class="max-w-screen-md mx-auto flex flex-col items-center justify-center">
<div class='px-4 py-8 mx-auto bg-[#86efac]'>
<div class='max-w-screen-md mx-auto flex flex-col items-center justify-center'>
<img
class="my-6"
src="/logo.svg"
width="128"
height="128"
alt="the Fresh logo: a sliced lemon dripping with juice"
class='my-6'
src='/logo.svg'
width='128'
height='128'
alt='the Fresh logo: a sliced lemon dripping with juice'
/>
<h1 class="text-4xl font-bold">404 - Page not found</h1>
<p class="my-4">
<h1 class='text-4xl font-bold'>404 - Page not found</h1>
<p class='my-4'>
The page you were looking for doesn't exist.
</p>
<a href="/" class="underline">Go back home</a>
<a href='/' class='underline'>Go back home</a>
</div>
</div>
</>
);
)
}

View file

@ -1,16 +1,19 @@
import { type PageProps } from "$fresh/server.ts";
import { type PageProps } from '$fresh/server.ts'
export default function App({ Component }: PageProps) {
return (
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset='utf-8' />
<meta
name='viewport'
content='width=device-width, initial-scale=1.0'
/>
<title>web</title>
<link rel="stylesheet" href="/styles.css" />
<link rel='stylesheet' href='/styles.css' />
</head>
<body>
<Component />
</body>
</html>
);
)
}

View file

@ -1,21 +1,21 @@
import { FreshContext } from "$fresh/server.ts";
import { FreshContext } from '$fresh/server.ts'
// Jokes courtesy of https://punsandoneliners.com/randomness/programmer-jokes/
const JOKES = [
"Why do Java developers often wear glasses? They can't C#.",
"A SQL query walks into a bar, goes up to two tables and says “can I join you?”",
'A SQL query walks into a bar, goes up to two tables and says “can I join you?”',
"Wasn't hard to crack Forrest Gump's password. 1forrest1.",
"I love pressing the F5 key. It's refreshing.",
"Called IT support and a chap from Australia came to fix my network connection. I asked “Do you come from a LAN down under?”",
'Called IT support and a chap from Australia came to fix my network connection. I asked “Do you come from a LAN down under?”',
"There are 10 types of people in the world. Those who understand binary and those who don't.",
"Why are assembly programmers often wet? They work below C level.",
"My favourite computer based band is the Black IPs.",
"What programme do you use to predict the music tastes of former US presidential candidates? An Al Gore Rhythm.",
"An SEO expert walked into a bar, pub, inn, tavern, hostelry, public house.",
];
'Why are assembly programmers often wet? They work below C level.',
'My favourite computer based band is the Black IPs.',
'What programme do you use to predict the music tastes of former US presidential candidates? An Al Gore Rhythm.',
'An SEO expert walked into a bar, pub, inn, tavern, hostelry, public house.',
]
export const handler = (_req: Request, _ctx: FreshContext): Response => {
const randomIndex = Math.floor(Math.random() * JOKES.length);
const body = JOKES[randomIndex];
return new Response(body);
};
const randomIndex = Math.floor(Math.random() * JOKES.length)
const body = JOKES[randomIndex]
return new Response(body)
}

View file

@ -1,5 +1,5 @@
import { PageProps } from "$fresh/server.ts";
import { PageProps } from '$fresh/server.ts'
export default function Greet(props: PageProps) {
return <div>Hello {props.params.name}</div>;
return <div>Hello {props.params.name}</div>
}

View file

@ -1,25 +1,26 @@
import { useSignal } from "@preact/signals";
import Counter from "../islands/Counter.tsx";
import { useSignal } from '@preact/signals'
import Counter from '../islands/Counter.tsx'
export default function Home() {
const count = useSignal(3);
const count = useSignal(3)
return (
<div class="px-4 py-8 mx-auto bg-[#86efac]">
<div class="max-w-screen-md mx-auto flex flex-col items-center justify-center">
<div class='px-4 py-8 mx-auto bg-[#86efac]'>
<div class='max-w-screen-md mx-auto flex flex-col items-center justify-center'>
<img
class="my-6"
src="/logo.svg"
width="128"
height="128"
alt="the Fresh logo: a sliced lemon dripping with juice"
class='my-6'
src='/logo.svg'
width='128'
height='128'
alt='the Fresh logo: a sliced lemon dripping with juice'
/>
<h1 class="text-4xl font-bold">Welcome to Fresh</h1>
<p class="my-4">
<h1 class='text-4xl font-bold'>Welcome to Fresh</h1>
<p class='my-4'>
Try updating this message in the
<code class="mx-2">./routes/index.tsx</code> file, and refresh.
<code class='mx-2'>./routes/index.tsx</code>{' '}
file, and refresh.
</p>
<Counter count={count} />
</div>
</div>
);
)
}