Init solidjs

This commit is contained in:
aronmal 2023-10-17 15:17:22 +02:00
parent ba1b1d7080
commit cd14a32e42
Signed by: aronmal
GPG key ID: 816B7707426FC612
150 changed files with 238 additions and 0 deletions

View file

@ -0,0 +1,20 @@
.increment {
font-family: inherit;
font-size: inherit;
padding: 1em 2em;
color: #335d92;
background-color: rgba(68, 107, 158, 0.1);
border-radius: 2em;
border: 2px solid rgba(68, 107, 158, 0);
outline: none;
width: 200px;
font-variant-numeric: tabular-nums;
}
.increment:focus {
border: 2px solid #335d92;
}
.increment:active {
background-color: rgba(68, 107, 158, 0.2);
}

View file

@ -0,0 +1,11 @@
import { createSignal } from "solid-js";
import "./Counter.css";
export default function Counter() {
const [count, setCount] = createSignal(0);
return (
<button class="increment" onClick={() => setCount(count() + 1)}>
Clicks: {count()}
</button>
);
}

3
src/entry-client.tsx Normal file
View file

@ -0,0 +1,3 @@
import { mount, StartClient } from "solid-start/entry-client";
mount(() => <StartClient />, document);

9
src/entry-server.tsx Normal file
View file

@ -0,0 +1,9 @@
import {
createHandler,
renderAsync,
StartServer,
} from "solid-start/entry-server";
export default createHandler(
renderAsync((event) => <StartServer event={event} />)
);

1
src/global.d.ts vendored Normal file
View file

@ -0,0 +1 @@
/// <reference types="solid-start/env" />

40
src/root.css Normal file
View file

@ -0,0 +1,40 @@
body {
font-family: Gordita, Roboto, Oxygen, Ubuntu, Cantarell,
'Open Sans', 'Helvetica Neue', sans-serif;
}
a {
margin-right: 1rem;
}
main {
text-align: center;
padding: 1em;
margin: 0 auto;
}
h1 {
color: #335d92;
text-transform: uppercase;
font-size: 4rem;
font-weight: 100;
line-height: 1.1;
margin: 4rem auto;
max-width: 14rem;
}
p {
max-width: 14rem;
margin: 2rem auto;
line-height: 1.35;
}
@media (min-width: 480px) {
h1 {
max-width: none;
}
p {
max-width: none;
}
}

39
src/root.tsx Normal file
View file

@ -0,0 +1,39 @@
// @refresh reload
import { Suspense } from "solid-js";
import {
A,
Body,
ErrorBoundary,
FileRoutes,
Head,
Html,
Meta,
Routes,
Scripts,
Title,
} from "solid-start";
import "./root.css";
export default function Root() {
return (
<Html lang="en">
<Head>
<Title>SolidStart - Bare</Title>
<Meta charset="utf-8" />
<Meta name="viewport" content="width=device-width, initial-scale=1" />
</Head>
<Body>
<Suspense>
<ErrorBoundary>
<A href="/">Index</A>
<A href="/about">About</A>
<Routes>
<FileRoutes />
</Routes>
</ErrorBoundary>
</Suspense>
<Scripts />
</Body>
</Html>
);
}

19
src/routes/[...404].tsx Normal file
View file

@ -0,0 +1,19 @@
import { Title } from "solid-start";
import { HttpStatusCode } from "solid-start/server";
export default function NotFound() {
return (
<main>
<Title>Not Found</Title>
<HttpStatusCode code={404} />
<h1>Page Not Found</h1>
<p>
Visit{" "}
<a href="https://start.solidjs.com" target="_blank">
start.solidjs.com
</a>{" "}
to learn how to build SolidStart apps.
</p>
</main>
);
}

19
src/routes/index.tsx Normal file
View file

@ -0,0 +1,19 @@
import { Title } from "solid-start";
import Counter from "~/components/Counter";
export default function Home() {
return (
<main>
<Title>Hello World</Title>
<h1>Hello world!</h1>
<Counter />
<p>
Visit{" "}
<a href="https://start.solidjs.com" target="_blank">
start.solidjs.com
</a>{" "}
to learn how to build SolidStart apps.
</p>
</main>
);
}